- babel: 使用缓存，use: ['babel-loader?cacheDirectory']
- resolve.alias: 使用别名，直接引用打包好的库
- module.noParse: 忽略没有采用模块化的文件库，不让 webpack 解析
- 使用 DllPlugin: 将基本库打包成单独的文件
- 使用 HappyPack: 开启多进程打包
- 使用 ParalleUglifyPlugin: 开启多进程压缩 js
- 使用自动刷新: watch:true
- HMR: plugin.push(new HotModuleReplacementPlugin())
- cdn: publicPath
- 开启 Tree Shaking: babel 保留 ES6 的模块 "modules": false
- 提取公共代码: CommonsChunkPlugin
- 按需加载: import(/* webpackChunkName: "name" */ 'path').then()
- 开启 Scope Hoisting: ModuleConcatenationPlugin
- 输出分析: webpack --profile --json > analyse.json && webpack-bundle-analyzer
webpack 优化策略
记录一下 webpack 的优化策略。