Using the VS Code debugger with Node

Rich Buggy
InstructorRich Buggy
Share this video with your friends

Social Share Links

Send Tweet
Published 5 years ago
Updated 3 years ago

This lesson shows you how to debug your Node.js applications using the VS Code debugger.

Instructor: [00:02] I'm going to start by creating a new node application that loops through the numbers zero to nine and prints each one twice. Open the debug view in VS Code. On a Mac, you can do this with the Shift command D keyboard shortcut.

[00:20] I don't currently have a debug configuration, so I'll need to add one. The default debug configuration correctly uses node to execute our index.js script, so I don't need to make any changes. I'll then have a break point in my code and launch the debugger which will run the application.

[00:41] Node stops execution at my break point allowing me to inspect the value of my variables in the debug view, all by moving my mouse over the variable name in the editor. I can continue execution until the next break point by clicking continue.

[00:58] As I only have one point, it stops at the same spot but the value of the variable is now one.

[01:05] I can also step through the code one line at a time using step over. This will execute the current line of code and stop at the next one. I'm going to stop debugging by clicking on the stop button and make the code a little more complicated. To do this, I'll create a new file called logo.js and add a function that logs its arguments to the console twice.

[01:32] Inside the index file, I'm going to use require to import the new logo function. I'll replace my two console.logs with a single logo call. This time, when I launch the debugger, it stops at my break point on the line with the logo call. Instead of stepping over the logo function, I'm going to step into it using step in. This allows me to debug the code inside the logo function. Using step over, I can now step through the code inside the logo function.

[02:07] When I stepped pass the end of the logo function, it takes me to the next line in the code after the logo was called. I'll continue to the break point again, then step back into the logo function. Sometimes, you'll step into a function then realize you don't want to continue debugging inside that function, but you would like to continue from where that function returns. This can be done using step out.

[02:34] Finally, I can restart the debugging session using restart.

egghead
egghead
~ an hour 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