webpack4 踩坑记

最近偶然想学习下webpack的配置，因而走上了webpack4踩坑的不归路。。。

webpack4默认的特性：

1. 配置默认初始化一些配置, 好比 entry 默认 './src' 开发模式和发布模式, 插件默认内置 CommonsChunk 配置简化
2. 使用 ES6 语法，好比 Map, Set, includes 新增 WebAssembly 构建支持 若是要使用 webpack
   cli 命令，须要单独再安装 webpack-cli 废弃并移除了

3. CommonsChunkPlugin，而且使用一些默认值以及更容易被复写的新 API optimize.splitChunks
   来代替，例如：

   optimization: {
         splitChunks: {
           chunks: 'all',
           name: 'common',
         },
         runtimeChunk: {
           name: 'runtime',
         }
       }

4. 再也不须要在 plugin 中设置 new webpack.optimize.UglifyJsPlugin

   ，只须要在配置中设置开关便可，而且 production 模式自动开启，能够经过 optimization.minimizer
      指定其余压缩库；

5. Webpack 4 提供了 sideEffects 的配置，引入的第三方插件在 package.json 里面配置

   sideEffects:false

6. extract-text-webpack-plugin 插件炸了，安装指定 extract-text-webpack-plugin 版本
   @next，或者是用optimization.minimizer代替