webpack构建时的日志显示

1、构建时的⽇志显示
展示⼀⼤堆⽇志，很多并不需要开发者关注
2、统计信息 stats
errors-only none
minimal none 只有发生错误或有新的编译时输出
none false 没有输出
normal true 标准输出
verbose none 全部输出
3、如何优化命令⾏的构建⽇志
使⽤ friendly-errors-webpack-plugin
· success: 构建成功的⽇志提示
· warning: 构建警告的⽇志提示
· error: 构建报错的⽇志提示
stats 设置成 errors-only

module.exports = {
entry: {
app: './src/app.js',
search: './src/search.js'
},
output: {
filename: '[name][chunkhash:8].js',
path: __dirname + '/dist'
},
plugins: [
+ new FriendlyErrorsWebpackPlugin()
],
+ stats: 'errors-only'
};

4、如何判断构建是否成功？
在 CI/CD 的 pipline 或者发布系统需要知道当前构建状态
每次构建完成后输⼊ echo $? 获取错误码

5、构建异常和中断处理
webpack4 之前的版本构建失败不会抛出错误码 (error code)
Node.js 中的 process.exit 规范
· 0 表示成功完成，回调函数中，err 为 null
· ⾮ 0 表示执⾏失败，回调函数中，err 不为 null，err.code 就是传给 exit 的数字

5、如何主动捕获并处理构建错误？

plugins: [
function() {
this.hooks.done.tap('done', (stats) => {
if (stats.compilation.errors && 
stats.compilation.errors.length && process.argv.indexOf('- -watch') == -1)
{
console.log('build error');
process.exit(1);
}
})
} ]

compiler 在每次构建结束后会触发 done 这 个 hook
process.exit 主动处理构建报错