如何去除vue项目中的console内容(个人笔记)

一、babel-plugin-transform-remove-console插件

1. 下载

npm install babel-plugin-transform-remove-console --save-dev；

2. 配置babel.config.js

// 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
  ]
}

二、webpack配置

// vue.config.js
chainWebpack(config) {
    config.optimization.minimizer('terser').tap((args) => {
      args[0].terserOptions.compress.drop_console = true
      return args
    })
}

参考文章：https://www.h5w3.com/60715.html
https://juejin.cn/post/7004045635620405278