一个 webpack 加载 vue.js 的问题

[varzy]

webpack 和 vue 的初学者一枚。尝试在 webpack.config.js 中定义的入口文件中引入 vue.js 和 我自己的 main.js，vue 来源于 yarn。但在入口文件添加 import Vue from 'vue'; 命令后，写在 main.js 中的 vue 代码将不能正常解析，并在浏览器中报错 vue is not defined。如果将 import Vue from 'vue'; 写在 main.js 中，那么 main.js 中的 vue 代码就可以被正常解析了。

在我这几天的了解中，webpack 难道不是将所有的 js 代码都打包为一个 js 文件吗？为什么还会出现上述问题？希望各位能给我点播一下。

---

报错情况下的入口文件代码：

import Vue from 'vue';
require('./js/main');

main.js:

var app = new Vue({
  el: "#demo",
  data: {
    msg: "hello, world"
  }
});

正常运行情况下的入口文件代码：

// import Vue from 'vue';
require('./js/main');

main.js:

import Vue from 'vue';

var app = new Vue({
  el: "#demo",
  data: {
    msg: "hello, world"
  }
});

[airyland]

不是。webpack 不是帮你直接合并文件。。

[izayl]

理解一下打包时候的作用域问题，如果按你理解的实现成功了，打包或者说模块化就没啥意义了

[oott123]

入口文件改成：
import Vue from 'vue';
window.Vue = Vue;
require('./js/main');
就行了。不过如 2 楼所说，这样模块化就失去了意义。

[Yuigahama]

不
你得了解一下 webpack 到底干嘛的
官方文档很详细

[yangff]

直接找个 seed 给他 clone 下来吧，简单直接=-=

[SourceMan]

vue-webpack-template