How to quickly and conveniently disable all console.log statements in my code?

Customizing your log behavior

You can create a toggleable logger utilizing a custom function for managing logs effectively. It provides eloquent control on the log visibility during both development and production.

// It's a bird...It's a plane...It's a debug flag!
const isDebugMode = true; 

// Old 'console.log', you served well. Time to level you up! 
const originalConsoleLog = console.log;

console.log = function() {
  // Debug mode? Log away! 
  if (isDebugMode) {
    originalConsoleLog.apply(console, arguments);
  }
};


Browser compatibility and quirks

Some browsers do not support console or have deviating behaviors. Assess the browser compatibility before applying your log hijacks.

// No console? No problem! We've got a plan B.
if (typeof console === "undefined" || typeof console.log === "undefined") {
  console = {};
  console.log = function() {};
}


Safe-logging in production environments

Protect your production environment from unnecessary logs using build tools and linters.

Configure build tools

With webpack or Babel, strip out console.log just in your production build:

• Webpack: Set a global DEBUG flag, then make your logs conditional.
• Babel: Apply babel-plugin-transform-remove-console to exterminate logs in production.

Set linters to warn

ESLint, when properly configured, will warn you every time a console.log sneaks into the source code, reminding you to change or discard it.

// ESLint rule example
"no-console": "warn"


Code maintainability and cleanliness

Maintaining a clean codebase is of utmost importance. You can manage console.log without impacting the quality your code.

Wrapping logs in a function

A wrapper function that checks environment variables or specific flags allows you to remove logs for production whilst preserving the actual logging logic.

Creating a logger object

Wrapping the logic within a logger object or a function that mimics the console.log behavior is another handy approach:

const Logger = {
  log: function() {
    // Debug mode? Then it's morphin' time!
    if (isDebugMode) originalConsoleLog.apply(console, arguments);
  },
  /* other methods like info, warn, error can be added */
};


Back up and restore

In scenarios where you need to temporarily disable console.log, store the original function before overriding. When required, do an easy restore.

let originalConsoleLog = console.log; // The real MVP
console.log = () => {};

// To restore:
console.log = originalConsoleLog;
