How to Remove Console.log from React Native Production Builds

#reactnative #typescript #performance #mobile

When building React Native apps, console.log is your best friend during development. But leaving it in your production build is a silent performance killer — and a potential security risk. In this post, I'll show you the cleanest way to automatically strip all console statements from your release builds with zero effort.

Why You Should Remove Console.logs in Production
Before jumping into the solution, here's why it matters:

Performance — Every console.log call serializes its arguments and sends them over the JS bridge, adding overhead to the JavaScript thread. In loops or frequent renders, this adds up fast.
Security — Sensitive data like API tokens, user info, or session data can be exposed in device logs. On Android, logs are readable via adb logcat on rooted devices.
Cleaner builds — Production logs should only contain critical information, not debug noise.

The Solution: babel-plugin-transform-remove-console
The cleanest approach is a Babel plugin that automatically strips all console.* calls at build time in production. This is even mentioned in the official React Native performance documentation.

Step 1 — Install the plugin

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

OR with yarn

yarn add babel-plugin-transform-remove-console --dev

Step 2 — Update your babel.config.js

module.exports = {
  presets: ['module:@react-native/babel-preset'],
  plugins: [
    'react-native-reanimated/plugin',
    ['@babel/plugin-proposal-decorators', { legacy: true }],
  ],
  env: {
    production: {
      plugins: ['transform-remove-console'], // 👈 only runs in production
    },
  },
};

That's it. Nothing else to configure.

How It Works
When you run a release build, Metro bundler passes your code through Babel. Babel detects NODE_ENV=production (set automatically by the build process — you don't need to configure this yourself) and runs the plugin, which strips every console.log, console.warn, console.error, and other console.* calls from the final bundle.

Your development workflow is completely unaffected — logs work normally in debug builds.

Want to Keep Some Logs?

If you want to keep console.error or console.warn in production (useful for crash reporting), you can use the exclude option:

env: {
  production: {
    plugins: [
      [
        'transform-remove-console',
        { exclude: ['error', 'warn'] }, // keep error and warn
      ],
    ],
  },
},