控制台瞬间干净！Vue 删除生产环境烦人的console.log打印，看完这个你就会了！

1.安装插件

需要安装babel-plugin-transform-remove-console插件

yarn add babel-plugin-transform-remove-console
//或者
npm install babel-plugin-transform-remove-console
 

2.配置babel.config.js

// 所有生产环境，或者也可以配置测试环境
const prodPlugin = []
 
if (process.env.NODE_ENV === 'production') {
  
// 如果是生产环境，则自动清理掉打印的日志，但保留error 与 warn
  prodPlugin.push([
    'transform-remove-console',
    {
      // 保留 console.error 与 console.warn
      exclude: ['error', 'warn']
    }
  ])
}
 
module.exports = {
   plugins: [
     ...prodPlugin
   ]
}
 

关于process.env.NODE_ENV 定义：

分别配置生产环境、本地、测试环境公共变量定义

下面给出生产环境的变量定义管理，测试环境和本地配置也是一样，可参考使用：

NODE_ENV='production'
VUE_APP_FLAG = 'pro'

VUE_APP_TITLE = ''
VUE_APP_IMGAPI=''//文件预览地址
VUE_APP_API=''//接口

outputDir = dist //输出dist文件