Remove console.log calls from production build #1491

Activity

1. gaearon commented on Feb 6, 2017

   

   gaearon

   on Feb 6, 2017

   Contributor

   More actions

   No, it’s not supported. You’d need to eject to do this automatically.

   👍React with 👍2Reacted by André Cruz and Wesley Almeida
2. edevil

   closed this as completedon Feb 6, 2017
3. lany9527 commented on Sep 29, 2017

   

   lany9527

   on Sep 29, 2017

   More actions

   you can find answer in this page:
   https://stackoverflow.com/questions/41040266/remove-console-logs-with-webpack-uglify
4. glocore commented on Jan 29, 2018

   

   glocore

   on Jan 29, 2018

   More actions

   I know this is not what this issue is about, but if you're only looking for a way to prevent the console messages from showing up in the production build, but don't mind that the code staying as is (meaning it won't be stripped out of your production code), then you could just monkey-patch console.log() so that it only works in development.

   Or a more elegant way of doing it would be using the debug module, which lets you display messages based on the name of the module calling it. This requires you to add a field to your localStorage as described here. You can simply not add this field for production and the debug messages won't show. I ended up creating a utility class to generate color-coded messages of different levels such as 'trace', 'info', 'warn', 'error', etc. The module name I passed was simply the name of my app, so I just needed to add this in my index.js:

   if(env.process.NODE_ENV !== 'production') localStorage.set('debug', 'name_of_app:*')
   
5. parkerdan commented on Feb 7, 2018

   

   parkerdan

   on Feb 7, 2018

   Last edited by parkerdan

   More actions

   I have disabled in prod by adding this at the root index.
   Is this a bad approach??

   function noop() {}
   
   if (process.env.NODE_ENV !== 'development') {
     console.log = noop;
     console.warn = noop;
     console.error = noop;
   }

   👍React with 👍10Reacted by Tami Wright, PeiSong, Anerco, Towfiq I., Malith, Aymen Chebbi, Sahil Satishkumar, nasdevel, Mjuk Biltvätt and Nithin Gangadharan

   😄React with 😄1Reacted by Malith

   ❤️React with ❤️1Reacted by Malith
6. barbagallo commented on Feb 27, 2018

   

   barbagallo

   on Feb 27, 2018

   Last edited by barbagallo

   More actions

   @parkerdan that's not a bad solution tbh, but it also probably depends on what you're doing.

   If someone wanted to be malicious and scan your code for key pieces of data that you use to debug with (i.e. user data, account data..), that'll still leak into the final output and may be found by searching for "console.".

   You could probably obfuscate usage of console by renaming it, and the methods, and then hooking them up to noop functions. Again, it prob depends on what you're trying to protect / hide.

   Or you could use something like this: https://www.npmjs.com/package/webpack-strip
7. behnammodi commented on Jul 2, 2018

   

   behnammodi

   on Jul 2, 2018

   More actions

   @gaearon Do you plan to add this item?

   👍React with 👍14Reacted by Irek Róg, Kevin A. Hernández Rostrán, Tirtha Guha, Towfiq I., Manikanta, newapx, Michael, Felipe Tadeo, ibmsoft, Albert Peiró and 4 more
8. lock

   locked and limited conversation to collaborators on Jan 18, 2019