1.happypack插件进行构建任务分解给多个子进程去并发的执行,会报错
遇到问题描述,在进行webpack优化时,先使用cache-loader进行缓存优化,然后再使用
happypack插件进行构建任务分解给多个子进程去并发的执行,会报如下错误:
AssertionError [ERR_ASSERTION]: HappyPack: Unrecognized option 'loader'
配置代码如下图:
plugins配置如下:
但现在报错如下:
AssertionError [ERR_ASSERTION]: HappyPack: Unrecognized option 'loader'
大概就是不识别loader的意思。
在尝试对比了N多方法以后,还是一直会报上面的错误,发现把rules里跟plugins都统一使用use这种方式,不再会报上面的错误
但继续会报下面的错误(小心累。。。)
Cannot read property 'outputOptions' of undefined
然后在github上搜索相关的原因是将MiniCssExtractPlugin与HappyPack一起使用时会出现
那就单独把MiniCssExtractPlugin这个loader提到rules里面,不在进行多线程加载
之后会报**Error: No PostCSS Config found in **的错误
解决方法是:当 postcss-loader
配置在 Happypack
中,必须要在项目中创建 postcss.config.js
//postcss.config.js
module.exports = {
plugins: [
require('autoprefixer')()
]
}
创建完成再启动项目会报如下错误:
TypeError: Cannot read property 'split' of undefined
看着是又回到了mini-css-extract-plugin这个loader上面了
在github搜索相关联问题,看到有人反馈了类似问题
但跟我出现的问题还是有区别,我如果把MiniCssExtractPlugin.loader
放在'HappyPack/loader?id=css'之后,也就是css-loader等之后这些loader之后,也会出现上面题主的问题
2.uglify-js-plugin打包不支持es6语法的问题
由于uglify-js-plugin版本比较老旧,在打包压缩js代码过程中,由于不支持识别es6语法,打包会报错,建议替换成别的类似功能的插件,如:terser-webpack-plugin
3.在打包时出现如下警告WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
错误原因,资源(asset)和入口起点超过指定文件限制,在webpack配置文件内做如下配置: