Remove all consoles when the Vue project is packaged and released

When writing projects, I have a habit of writing a lot of console. The test environment is ok, but the production environment is not good when people see it, and it is too troublesome to remove one by one

Babel-plugin-transform-remove-console is a plugin that solves a publishing problem

Install the plug-in first

yarn add babel-plugin-transform-remove-console

Copy the code

After installation, a new babel.config.js file will be added to the project directory. Add transform-remove-console to the file, as shown below:

Personal configuration preserves errors and warnings

// All production environments
const prodPlugin = []

if (process.env.NODE_ENV === 'production') {
  
// In a production environment, logs are automatically cleared but errors and warn are reserved
  prodPlugin.push([
    'transform-remove-console',
    {
      // Keep console.error and console.warn
      exclude: ['error'.'warn']})}module.exports = {
  plugins: [
    ...prodPlugin
  ],// This is it
  presets: [
    // https://github.com/vuejs/vue-cli/tree/master/packages/@vue/babel-preset-app
    '@vue/cli-plugin-babel/preset'].'env': {
    'development': {
      // babel-plugin-dynamic-import-node plugin only does one thing by converting all import() to require().
      // This plugin can significantly increase the speed of hot updates, when you have a large number of pages.
      'plugins': ['dynamic-import-node']}}}Copy the code