最近在学习Vue-webpack的视频教程
https://www.imooc.com/video/16402
2-1 vue-loader+webpack项目配置

这篇课程真的很坑人，跟着做一毛一样结果不断的报错，可能是他之前有做过，所以视频里他写的代码才没有报错，反正这些报错整的我快崩溃了

至于他这个开发工具我就不多说了，也许是我用惯了HBuilder ，再去用 Visual Studio Code 和 Atom 时有点懵逼，不会用而且中文插件安装上老是报错。

闲话说一箩筐，现在开始说正事。。。。。

我的终端用 npm run build 命令运行的时候，报了以下错误
报错的状态：

报错

只要是和我报错的一样就可以用下面解决：

1，修改package.json中代码
将老师编辑的 
"build": "webpack --config webpack.config.js"
修改为
"build": "webpack --mode development"

2，修改webpack.config.js中代码
顶部添加
const {
VueLoaderPlugin
} = require('vue-loader');
将【module】中新增【css】以及末尾添加【plugins】
修改为：
module: {
rules: [{
test: /.vue$/,
loader: 'vue-loader'
}, {
test: /.css$/,
use: ['vue-style-loader', 'css-loader']
}]
},
plugins: [
new VueLoaderPlugin()
]

这两种方法中第一种我没有测试过，我使用的是第二种解决办法

修改过后可以用在重新 用 npm run build 运行了

这是解决后的状态：

终端

同时，会生成一个你在 webpack.config.js 文件所写的文件名和 js 文件
我写的文件夹名为“dist”，js 文件名为“bundle.js”

文件夹名和 js 文件名

还有一个报错在终端会提示

mode 、production

这两个单词，那么解决办法还是在 webpack.config.js 中解决

这是什么意思呐？
webpack官方说是模式没有设置

很好解决：

官方解决办法 https://webpack.js.org/concepts/mode/

不想看官方的可以看我的：

模式设置

之前碰到的报错都没有保存，只有这两个错

希望能给你有所帮助，谢谢你的浏览！