提高webpack的打包速度方法

如何提升webpack打包速度

1.跟上开发技术的迭代

Node、Yarn、Npm、Webpack保持最新最稳定的版本

2.在尽可能少的模板上使用loader

合理的使用exclude或者include的配置，来尽量减少loader被频繁执行的频率。当loader执行频率降低时，也会提升webpack的打包速度。比如：

module: {
    rules: [{ 
      test: /\.js$/,
      include: path.resolve(__dirname, '../src'), // 只对src目录下的js文件做打包转译工作
      // exclude: /node_modules/, // 如果你的js文件在node_modules里边，就不使用babel-loader了，因为它里边的代码都是些第三方代码，已经做好了转译的工作。
      use: [{
        loader: "babel-loader"
      }]
    }]
}

3.Plugin尽量少并可靠

选择性能好、官方推荐的插件
plugin尽量少用，减少代码冗余
剔除开发环境无用插件

const OptimizeCSSAssetsPlugin = require('optimize-css-assets-plugin');
const prodConfig = {
  mode: 'production',