DEV Community

Cover image for Console.log Development vs Production
Zain Ahmed
Zain Ahmed

Posted on

Console.log Development vs Production

I was working on a project with some local software house developer and what i notice is they use to much console's in application and these console are all in from local/development to production which is really bad for the application , so i decided to work on it and make a solution to this, we can create a custom function which will work for use to console data on some specific environment like on local/development but not on production,

i just create a util folder and in it i create a file name utils.js in which i define a function

Alt Text

in this example you can see i just create a function with name "consoleLog" which console the data with string which comes from parameter pass to this function, ignore the env and if condition , now this console will work on every environment and console dat,
but we want to console data only in development

npm i react-dotenv install this library and create .env file on your root folder, and then see the previous logic.

Alt Text

Alt Text

Alt Text

you can also just do a simple logic in root/app file in componentDidMount/userEfect with
Alt Text

Top comments (5)

Collapse
 
lukeocodes profile image
@lukeocodes 🕹👨‍💻

You could also disable console.log in production?

console.log = function() {}
Enter fullscreen mode Exit fullscreen mode
Collapse
 
zainbinfurqan profile image
Zain Ahmed

Yes you can also define simple logic in app/root file and make console.log func to empty function, thanks for this suggestion.

Collapse
 
lukeocodes profile image
@lukeocodes 🕹👨‍💻

Ideally, you would use eslint to highlight them all. Then, before accepting the changes, go and remove them.

Thread Thread
 
zainbinfurqan profile image
Zain Ahmed

sorry didn't get your point

Thread Thread
 
lukeocodes profile image
@lukeocodes 🕹👨‍💻

Don't let console.log make it to production. Edit them out. eslint can read the code and warn you