-
目录
,
当引入多个文件时,一个打包的文件会非常大,浏览器加载需要很长的时间,影响体验,可以进行code spliting拆分打包的代码
webpack.config.js
const path = require('path')
module.exports ={
mode:'development',
entry:{
// lodash:"./src/fun.js",
main:'./src/index.js'
},
module:{
rules:[
]
},
output:{
filename:'[name].js',
path:path.resolve(__dirname,'dist')
},
optimization:{
splitChunks:{
chunks: "all",//默认async 分割只对异步生效 all全部生效
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
}
}
// codespliting
}
}
}