DEV Community

Cover image for Remove all console.log() from your project in less than a minute

Remove all console.log() from your project in less than a minute

Suhail Kakar on August 22, 2021

Introduction console.log() is a debugging tool that can assist you to figure out what your code is doing. You may follow along as your c...
Collapse
 
thefluxapex profile image
Ian Pride • • Edited

Won't this only work if the console command is the only thing until the end of the line? If you have anything else on the same line after it it will delete that as well. So if your line has multiple console commands in a ternary shortcut (? :, I get that this is not readability friendly, but since it's just debug anyway it's still common) or any other regular commands then you'll have a problem.

Collapse
 
ayc0 profile image
Ayc0 •

That's cool!
But this has a few issues:

  • it won't work with multi line console.log,
  • it won't work if you have something else in the same line after the console,
  • it won't work with if you do something like const fn = console.log (I mean it will remove the console, but the expression will become wrong).

I'd recommend instead using AST based tools like a webpack plugin, or a eslint custom rule, to detect a CallExpression with the callee being a MemberExpression with the object being console and the property log.

Collapse
 
suhailkakar profile image
Suhail Kakar •

Thanks @ayc0
For multiline you need to use console\.log\(([^)]+)\);

Collapse
 
ayc0 profile image
Ayc0 •

It still won't work for code snippet like those:

console.log(
  'hello',
   world(1)
)
Enter fullscreen mode Exit fullscreen mode

(As it contains a closing parenthesis)

Thread Thread
 
wimdenherder profile image
wimdenherder • • Edited

console\.log\((.|\n)*?\);?

It matches anything until it encounters ) again, with an optional whitespace and ;

Collapse
 
rishabh_sharma_ profile image
Rishabh Sharma •

this is helpful

Collapse
 
mdadil09 profile image
Md Adil •

it only selected the console.log which are commented not uncommented ones

Collapse
 
wimdenherder profile image
wimdenherder • • Edited

It's funny how console.log.*$ can read like an wildcard *, but it's not. This regular expression matches also:

function console2log() {
return "A super important function in the script";
}

That's because the dot (.) in regex matches anything. The * means that it can occur 0 or more times.

PS: visual code treats the regex case insensitive

Collapse
 
wimdenherder profile image
wimdenherder • • Edited

This matches also multi lines:

console\.log\((.|\n)*?\);?

Collapse
 
wimdenherder profile image
wimdenherder •

PS: if you have ) in your message this one won't work
console.log("check function() {}")

Collapse
 
deyvisonrocha profile image
Deyvison Rocha •

Nice tip!

Collapse
 
suhailkakar profile image
Suhail Kakar •

Thank you Deyvison, Glad you liked it : )

Collapse
 
jahidhasan profile image
Jahid Hasan •

great

Collapse
 
suhailkakar profile image
Suhail Kakar •

Thanks Jahid :D

Collapse
 
stevenharderjr profile image
stevenharderjr •

This is a beautiful illustration of the โ€œnow you have two problemsโ€ principle of regex.

Collapse
 
geoidesic profile image
Noel da Costa •

Doesn't work for multi-line console logs