- 使用 html-webpack-plugin 配置 html 模板文件
- 使用 clean-webpack-plugin 在打包输出前清空文件夹
- 为 css 添加浏览器前缀:postcss-loader autoprefixer
- 使用 mini-css-extract-plugin,把 css 样式从 js 文件中提取到单独的 css 文件中
- 使用 extract-text-webpack-plugin 拆分多个 css
- 使用 file-loader、url-loader 打包 图片、字体、媒体、等文件
- 使用 HotModuleReplacementPlugin 配置 webpack-dev-server 进行热更新
- 合理的配置 mode 参数与 devtool 参数
- 缩小文件的搜索范围,配置 include exclude alias noParse extensions
- 使用 HappyPack 开启多进程 Loader 转换
- 使用 webpack-parallel-uglify-plugin 增强代码压缩
- 使用 webpack 内置的 DllPlugin DllReferencePlugin 抽离第三方模块
- 配置缓存:cache-loader
- 引入 webpack-bundle-analyzer 分析打包后的文件
- externals:有时我们希望我们通过 script 引入的库,如用 CDN 的方式引入的 jquery,我们在使用时,依旧用 require 的方式来使用,但是却不希望 webpack 将它又编译进文件中