访客 说在前面
先来说一下这个插件的作用，引用官网的一句话，该插件使用[terser](https://github.com/terser/terser)来压缩JavaScript。
我们项目主要用来去除生产环境中的console以及debugger等信息。
餐前小菜
值得注意的是，vue-cli在开发环境中TerserWebpackPlugin是不会生效的，所以在引入该插件时，即使我们希望只在生产环境中生效，不需要判断当前的环境。
应用初尝试
vue-cli对于TerserWebpackPlugin是有封装的，所以直接按照官网介绍的方式引入是有问题的，当然，问题不是说说而已，下面给大家对比一下不同的引入方式对于打包产生的损耗。
//vue.config.jsconstTerserPlugin=require('terser-webpack-plugin')...//othercodeconfigureWebpack:{optimization:{minimizer:[newTerserPlugin({parallel:4,terserOptions:{compress:{warnings:true,drop_debugger:true,//删除debuggerdrop_console:true//删除console}}})],}}此时运行npmrunbuild命令，可以发现打包时间是：
究其原因，大家此时可以执行一下vueinspect>output.js命令，查看一下打包的配置文件，搜索关键字minimizer，可以发现他有两个options，我们有理由相信，这种情况下去打包，这两个插件会分别处理一遍我们的工程，为什么？
本身vue-cli会帮我们引入TerserWebpackPlugin,特定的webpack版本也会自动引入该插件，在vue.config.js中引入的TerserPlugin经过定位就是webpack引入的，所以在webpack配置中，一共new()了两次，自然也就会处理两次。
优化尝试
下面我们尝试去覆盖已有的配置，添加删除console以及debugger的代码：
//vue.config.jschainWebpack(config){config.optimization.minimizer('terser').tap((args)=>{args[0].parallel=4args[0].terserOptions={compress:{warnings:true,drop_console:true,drop_debugger:true}}returnargs})}此时去查看打包配置的文件，搜索minimizer，可以发现就只有一个options了，说明我们已经成功完成了合并，但是上面的写法好像把terserOptions属性完全覆盖了，我们看一下当前的打包时间：
不错，快了40秒左右的时间。
最佳体验
其实vue-cli给出的配置，肯定是经过优化调整的，所以不是特殊情况，就不要覆盖原有配置了，所以改成下面这种写法：
//vue.config.jschainWebpack(config){config.optimization.minimizer('terser').tap((args)=>{args[0].parallel=4args[0].terserOptions.compress.warnings=trueargs[0].terserOptions.compress.drop_debugger=trueargs[0].terserOptions.compress.drop_console=truereturnargs})}现在来看看打包的时间：
速度又增加了40秒左右。
说到最后
以上。