webpack优化实战
前言
公司的项目已经维护了几年,最近感觉项目打包构建时越来越吃力了,时间越来越久,甚至还出现内存溢出打包失败的情况。所以开始着手优化webpack打包的设置:
一、使用happypack启动并行打包
1、引入happypack插件开启并行打包,重新利用系统资源,具体写法如下:
安装:
npm i -D happypack
使用:
module: {
loaders: [
{
test: /\.js$/,
include: [resolve('src')],
exclude: /node_modules/,
// id 后面的内容对应下面
loader: 'happypack/loader?id=happybabel'
}
]
},
plugins: [
new HappyPack({
id: 'happybabel',
loaders: ['babel-loader?cacheDirectory'],
// 开启 4 个线程
threads: 4
})
]
实测优化后打包速度得到极大提升。
未完待续。