splitChunks: {
// chunks可以为三种值：async,initial,all；决定代码满足条件后是否进行拆分。
// initial表示只考虑非import()异步导入代码进行拆分，async表示只拆分异步代码块，而all表示同异步都加入拆分范畴。
chunks: 'async',
// 满足尺寸才发生拆分
// 例如导入10kb的依赖包小于30kb便不会拆分代码块
minSize: 30000,
// 当bundle达到maxSize，必须进行拆分
// 例如jquery与lodash合并成了140kb，maxSize定位80kb，便会拆分两个依赖
maxSize: 0,
// 最少被引用的chunk个数
// 例如一个入口块和一个异步块都引用了lodash，minChunks大于2时就不会添加新chunk来装lodash
minChunks: 1,
// 异步代码块最多可拆分次数
// 假设某个import()模块有2MB，maxSize设定为500kb，如果此属性为1，模块最多就只能拆分一个bundle出去。
maxAsyncRequests: 5,
// 这属性和maxAsyncRequests道理一致，不过是作用与initial模块的
maxInitialRequests: 3,
// bundle自动命名使用的连接字符
automaticNameDelimiter: '~',
// bundle自动命名时名称长度限制
automaticNameMaxLength: 30,
// 可为bool、string类型，true是会使用默认命名，否则使用序号命名；string指定文件名称
name: true,
// 自定义拆分组
cacheGroups: {
// 每个属性就是一个分组
vendors: {
// 导入路径的正则匹配，这为所有node_modules引用的模块代码
test: /[\\/]node_modules[\\/]/,
// 优先级默认为0，如果两个组引用了同一个模块，优先级高的组可以获得此模块
priority: -10
},
default: {
minChunks: 2,
priority: -20,
// 是否复用其他chunk内已拥有的模块
// 默认为false，关闭表示拆分出复用部分的模块，给双方引用
reuseExistingChunk: true
}
}
}
复制代码
一些提示
- 默认配置在大多数场景下都有不错的表现
- webpack的externals更适合把第三方库移到CDN上
- test匹配规则也可以是一个方法，分组更灵活
更多相关的资料
