1. 3
    Make Console Logging in VS Code 10x Easier with Turbo Console Log
    2m 19s

Make Console Logging in VS Code 10x Easier with Turbo Console Log

Share this video with your friends

Social Share Links

Send Tweet
Published 5 years ago
Updated 3 years ago

The Turbo Console Log extension lets us quickly add console.log statements with additional data, which makes debugging your code easier.

Steven Mercatante: [00:01] Start by searching for turbo console log and install it. I've got a demo file here with some test variables, a test function, and a test class. The easiest way to use turbo console logger is to log individual variables.

[00:20] Select the variable, and then hit CTRL+ALT+L. You see that a console log statement is automatically added for us. It includes the name of the variable, the variable itself, and this TCL prefix, which stands for turbo console logger.

[00:37] We can also log multiple variables at once. We select both of these, and again hit CTRL+ALT+L. We instantly have our log statements. A cool feature of this extension is that it can also tell you the name of the function or the class that contains the variable that you're logging. Let's test it on the greet function.

[01:03] You'll notice that we still have the TCL prefix, but the log also tells us the function that was this called from and the variable name itself. We can do the same thing for the class properties. Select both of them, and again, hit CTRL+ALT+L. This time, we have the TCL prefix, the name of the class, the name of the method, and then finally, the name of the property itself.

[01:29] This is great for debugging, but at some point, all these messages do become noisy. You can comment all of them out at once by pressing ALT+SHIFT+C. You can uncomment these by using ALT+SHIFT+U. You can also delete all of them using ALT+SHIFT+D.

[01:49] You can also change the prefix from TCL to whatever you want by going into the settings. Look for turbo console log-log message prefix and change this to whatever you want. I'll use three hashes. Come back to our demo file, and select some variables. You'll notice here that we've got our custom prefix.

egghead
egghead
~ 12 minutes ago

Member comments are a way for members to communicate, interact, and ask questions about a lesson.

The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io

Be on-Topic

Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.

Avoid meta-discussion

  • This was great!
  • This was horrible!
  • I didn't like this because it didn't match my skill level.
  • +1 It will likely be deleted as spam.

Code Problems?

Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context

Details and Context

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

Markdown supported.
Become a member to join the discussionEnroll Today