(精华)2020年7月12日 webpack 代码分割和多线程打包

optimization: {
     
  splitChunks: {
     
    chunks: 'async', //对同步,异步,所有的模块有效 
    minSize: 30000, //当模块大于 30kb 
    maxSize: 0, //对模块进行二次分割时使用,不推荐使用 
    minChunks: 1, //打包生成的 chunk 文件最少有几个 chunk 引用了这个模块 
    maxAsyncRequests: 5, //模块请求 5 次 
    maxInitialRequests: 3, //入口文件同步请求 3 次 
    automaticNameDelimiter: '~',
    name: true,
    cacheGroups: {
     
      vendors: {
     
        test: /[\\/]node_modules[\\/]/,
        priority: -10 ,//优先级 数字越大,优先级越高 
        default: {
     
          minChunks: 2,
          priority: -20,
          reuseExistingChunk: true
        }
      }
    }
  },
  minimize: true,
  minimizer: [
    new TerserPlugin({
     
      cache: true, // 是否缓存
      parallel: 4 // 是否并行打包,多线程 // parallel: 4,
    }),
  ],
},

你可能感兴趣的:(#,webpack)