optimization代码分割的配置

optimization: {
splitChunks: {
chunks: "all",//async异步加载代码分割有效，all都有效 
minSize: 30000,//引入的库大于30kb,才做代码分割
maxSize:50000,//分割后的代码,，webpack会尝试二次分割，拆分成多个50kb左右的文件；
minChunks: 2,//文件至少被用了2次才分割；
maxAsyncRequests: 5,//同时加载的模块数最多是5个，超过5个只分割前面的5个文件，后面的不处理
maxInitialRequests: 3,//入口文件做多分割3个，超过3个只分割前面的5个文件，后面的不处理
automaticNameDelimiter: '~',
name: true,//让vendors命名规则生效，一般不改；
cacheGroups: {//定义分割的代码放到哪个文件中
vendors: {
//1.会影响分割后文件的文件名，符合这个组，打包的文件名前会加上组名，
//2.再加上分割代码所处的入口文件名，也会加上。main: './src/index.js'；
//3.如果有魔法注释，就用魔法注释的名字；
//4.用automaticNameDelimiter作为连接符
test: /[\\/]node_modules[\\/]/,//引入的库是从node_modules引入，就分割库代码到当前组
priority: -10,//一个模块，符合多个组的test条件，这个时候就由priority决定放哪个组，值越大优先级越高
chunks: 'initial',//配置这个，是为了下面分割后的代码命名不报错，
filename:'vendors.js'//分割后的代码，就叫vendors.js
},
default: {
// 处理非node_modules文件引入，分割的配置
minChunks: 2,
priority: -20,
reuseExistingChunk: true//如果某个模块已经被分割打包过了，再次打包的时候，就忽略这个模块，复用之前那个模块
}
}
}
},