Remove console using babelJS

Remove console.* in JavaScript with babelJS

Prerequisite

  • Project configured with babelJS (Work out of the box in React/React Native)

Installation

Terminal screencast from asciinema
npm install babel-plugin-transform-remove-console --save-dev

Configuration

Create a .babelrc file in your project root folder, below is an example .babelrc for React-Native project.

{
  "presets": [
    "react-native"
  ],
  "env": {
    "production": {
      "plugins": [
        "transform-remove-console"
      ]
    }
  }
}
  • Presets (Preset plugins for particular platform or version, eg: react-native, react-app, env or more)

Console.* is useful in debug. Why remove it ?

We shall removed the console.* in our production released to prevent any confidential data leaked that may abused by malicious users.

There is another reason caused by console.*performance issues in JavaScript app.

Therefore, I believed the plugin is a helpful tool, that help us get rid of console.* when released into production.