其他分享
首页 > 其他分享> > webpack打包详细说明

webpack打包详细说明

作者:互联网

webpack概念module、chunk和bundle

webpack默认配置

module.exports = {
  //...
  optimization: {
    splitChunks: {
      chunks: 'async',
      minSize: 30000,
      minChunks: 1,
      maxAsyncRequests: 5,
      maxInitialRequests: 3,
      automaticNameDelimiter: '~',
      name: true,
      cacheGroups: {
        vendors: {
          test: /[\\/]node_modules[\\/]/,
          priority: -10
        },
        default: {
          minChunks: 2,
          priority: -20,
          reuseExistingChunk: true
        }
      }
    }
  }
};

webpack.splitChunks.chunk

webpack.splitChunks.chunk.cacheGroups

cacheGroups会继承默认配置里面的chunks、minSize、minChunks等等,除了test, priorityreuseExistingChunk,这三个是只在cacheGroup这一层生效。

webpack.splitChunks.chunk.maxInitialRequests

限制入口的拆分数量

webpack.splitChunks.chunk.maxAsyncRequests

限制异步模块内部的并行最大请求数,可以理解为是每个import()它里面的最大并行请求数量。

其它

标签:详细,chunk,模块,webpack,cacheGroup,拆分,打包,splitChunks
来源: https://www.cnblogs.com/reamd/p/15745892.html