vue实用插件集合

一、生产环境去除console

插件：babel-plugin-transform-remove-console 官方地址

安装：

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

在 babel.config.js 中配置(vue cli3使用方式)

// 生产环境去除console
const prodPlugin = []

if (process.env.NODE_ENV === 'production') {
  // 如果是生产环境，则自动清理掉打印的日志，但保留error 与 warn
  prodPlugin.push([
    'transform-remove-console',
    {
      // 保留 console.error 与 console.warn
      exclude: ['error', 'warn']
    }
  ])
}

module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset'
  ],
  plugins: [
    ...prodPlugin
  ]
}

二、移动端调试工具

插件：vConsole git地址

安装：

npm i vConsole --save-dev

使用：

//main.js
import Vconsole from 'vconsole'

if (process.env.NODE_ENV == "test") { //在test环境引入，本地和生产不引入
    const vConsole = new Vconsole()
    Vue.use(vConsole)
}

效果：会在手机右下角出现一个绿色小按钮