知食记
搜索文档…
⌃K

配置记录

移除console.log

TerserPlugin

optimization: {
minimizer: [
new TerserPlugin({
sourceMap: true,
parallel: true,
terserOptions: {
compress: {
warnings: false,
drop_debugger: true,
drop_console: true
}
}
}),
]
}

UglifyPlugin

const UglifyJSPlugin = require('uglifyjs-webpack-plugin')
...
optimization: {
minimizer: [
new UglifyJSPlugin({
uglifyOptions: {
compress: {
drop_console: true,
}
}
})
]
}

babel-plugin-transform-remove-console

module: {
rules: [
{
test: /\.js$/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-react', '@babel/preset-env'],
plugins: [
'babel-plugin-transform-remove-console'
],
},
}
}
]
}

ProgressBarPlugin

把打包的进度以进度条的形式显示出来,同时也可以自定义显示百分比的格式样式。
var ProgressBarPlugin = require('progress-bar-webpack-plugin');
// ...
plugins: [  
new ProgressBarPlugin({
format: '  build [:bar] ' + chalk.green.bold(':percent') + ' (:elapsed seconds)',
clear: false    
})
]

SpeedMeasurePlugin

这款插件能将每一个plugin每一个loader的打包时间以及总打包时长统计出来。

BundleAnalyzerPlugin

在打包结束之后能将各个包的内容、信息、占比以图形化界面表现出来,界面中还有其他的交互和过滤器。