Vue打包时生产去除console

Vue打包时生产去除console

vue开发中，再dev本地调试会使用console.log()打印数据到控制台进行调试，希望在打包到生产自动去除这些console。

使用babel插件babel-plugin-transform-remove-console

npm install babel-plugin-transform-remove-console -D

配置babel.config.js

const prodPlugin = []; // 配置一个要展开的生产插件
if (process.env.NODE_ENV === 'production') { // 如果是生产环境去除console
  prodPlugin.push('transform-remove-console');
}
module.exports = {
  presets: ['@vue/cli-plugin-babel/preset'],
  plugins: [
    [
      'component',
      {
        libraryName: 'element-ui',
        styleLibraryName: 'theme-chalk'
      }
    ],
    ...prodPlugin // 展开到插件中
  ]
};

反正我平时调试的时候喜欢用console.log(‘funcName===’, res)把返回的数据打印出来方便看请求的数据，这样配的化打包生产就比较方便了。