引入jquery和lodash在讲解cacheGroups那块时怎么配置是输出两个打包文件？
来源：4-6 SplitChunksPlugin 配置参数详解（2）
特别平凡的人
2020-03-12
splitChunks: {
chunks: ‘all’, // initial（同步） async（异步） all（同步和异步）
minSize: 30000, // 0 是为了测试 index.js 同步引入 test.js模块
// maxSize: 0, // 50kb （lodash 1MB） 一般我们不配置这个 maxSize
minChunks: 1, // 模块引入的次数
maxAsyncRequests: 5, // 一般不用改
maxInitialRequests: 3, // 一般不用改
automaticNameDelimiter: ‘~’, // 一般不用改
name: true, // 一般不用改
}
引入jquery和lodash在讲解cacheGroups那块的内容时老师你说如果不配置cacheGroups是打包出两个文件，这个要怎么配置才能演示出来打包两个文件呢？
是都设置成false吗？cacheGroups: { vendors: false, default: false }，这样配置不是不会分割代码了嘛
1回答
-
特别平凡的人
提问者
2020-04-13
按照下面这样配置就可以了：
optimization: {
splitChunks: {
chunks: 'all', // initial（同步） async（异步） all（同步和异步），推荐 all
minSize: 30000,
minChunks: 1, // 模块引入的次数
maxAsyncRequests: 5, // 异步的按需加载模块最大的并行请求数，通过import()或者require.ensure()方式引入的模块，分离出来的包是异步加载的（一般不用改）
maxInitialRequests: 3, // 初始加载网页的最大并行数（一般不用改）
automaticNameDelimiter: '~',
name: true,
cacheGroups: {
'split-lodash': {
test: (module) => {
return /lodash/.test(module.context)
},
priority: 0,
filename: 'split-lodash.js'
},
'split-vue': {
test: (module) => {
return /vue|vuex|vue-router/.test(module.context)
},
priority: -10,
filename: 'split-vue.js'
},
vendors: {
test: /[\\/]node_modules[\\/]/,
priority: -20,
filename: 'vendors.js'
},
default: false
}
}
}
00
相似问题
回答 2
回答 2