Webpack打包优化（2）

将第三库分割成多个文件

• 利用浏览器缓存
• HTTP2 并发数量没有限制

使用SplitChunksPlugin进行手工分割

• optimization.splitChunks
  https://webpack.docschina.org/plugins/split-chunks-plugin/

splitChunks=[  maxInitialRequest:Infinity,  maxSize:0,  chunks:'all',  cacheGroups:{   antVendor:{     name :'ant-design',     test:/[\\/]node_modules[\\/](ant-design-vue)[\\/]/,   },   vendor:{   name :'vendor',   test:/[\\/]node_modules[\\/](!ant-design-vue)[\\/]/,   }  } ] 

根据文件大小自动分割

splitChunks=[  maxInitialRequest:Infinity,  maxSize:300*1024,  chunks:'all',  cacheGroups:{   antVendor:{   test:/[\\/]node_modules[\\/]/, name(module):{ const packageName=module.context.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)[1] return `npm.{packageName.replace('@','')` }    }  } ]