webpack学习及填坑总结

今天学习并实践了webpack，实践中碰到了不少坑，在此把填坑过程记录下来。

1、webpack的安装及工程配置已经收藏在webpack收藏夹中，基本过程都一样。

2、在安装webpack前，要装nodejs，nodejs最好装LTS(长期支持版本)

3、在用webpack打包时，在控制台输入“webpack”一直报错，无法将“webpack”项识别为cmdlet、函数、脚本文件或可运行程序的名称......，解决方法有两个：

     1）全局安装webpack，npm install -g webpack

     2）如果只安装了当前工作目录中的webpack，则直接在命令行输入 node_modules/.bin/webpack

4、webpack内置的JS压缩插件，webpack.optimize.UglifyJsPlugin，不能使用了，只要在package.json配置的script里面写成
"build": "webpack --mode production", js自动就压缩了；

5、loader配置的问题， 老版本的module: { loaders:[ { test: /\.js[x]?$/, exclude: /node_modules/, loader: 'babel-loader?presets[]=es2015&presets[]=react' }, ] }，

新版本的module都改为： module: { rules: [ { test: /\.js$/, exclude: /node_modules/, loader: "babel-loader", options: { presets: ["es2015","react"] } } ] }，

具体可看http://www.jqhtml.com/7626.html。

6、Webpack新版本要求配置module中的loader不能缩写，也就是loader:"json-loader"中的-loader必须要写，类似的还有loader:"vue-loader"