vue-cli3 生产环境去掉 console.log

1.由于使用 uglifyjs-webpack-plugin 插件打包会报错，不在介绍使用方法，

2.使用 webpack 提供的删除 console 的插件：

安装 terser-webpack-plugin

<font style="color:#839496;">npm install terser-webpack-plugin -D</font>

然后在vue.config.js中写插件的配置：

module.export = {
  configureWebpack: (config)=>{
    if(process.env.NODE_ENV === 'production'){
      config.optimization.minimizer[0].options.terserOptions.compress.drop_console = true。
    }
  }
}

但是不推荐这种用法，因为打包后包文件相对于是比较大的

3.使用 babel-plugin-transform-remove-console 插件（推荐)

# 参考 https://forum.vuejs.org/t/remove-console-logs-from-production-buils/39327
# 安装依赖库
$ npm install babel-plugin-transform-remove-console -D
# or
$ yarn add babel-plugin-transform-remove-console --dev

【babel.config.js】配置如下

const plugins = ["@vue/babel-plugin-transform-vue-jsx"];
// 生产环境移除console
if (process.env.NODE_ENV === "production") {
  plugins.push("transform-remove-console");
}
module.exports = {
  plugins: plugins,
  presets: [
    [
      "@vue/app",
      {
        modules: false,
        targets: {
          browsers: [
            "> 1%",
            "last 2 versions",
            "not ie <= 8",
            "Android >= 4",
            "iOS >= 8",
          ],
        },
        useBuiltIns: "entry",
      },
    ],
  ],
};

我比较推荐这种方法，利用此插件打包后和插件二相比较打包后差了 10 多 k