Detailed explanation of how to debug Node.js programs more simply and effectively in vscode! !

This article will introduce to you a super simple method to use vscode to debug Node.js. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to everyone.

Recommended learning: "vscode tutorial", "nodejs tutorial"

Let's Let's face it... debugging Node.js has always been a pain in the ass.

Getting to the pain points of debugging Node.js

If you have ever been lucky enough to write code for a Node.js project, Well you know what I'm talking about when I say debugging it to find what's going wrong isn't the easiest thing.

Unlike JavaScript in the browser, and unlike Java with a powerful IDE like IntelliJ, you cannot set breakpoints everywhere, refresh the page or restart the compiler, nor can you slowly review the code and inspect objects , evaluate functions, find variations or missing variables, etc. It's just too bad that you can't do that.

But Node.js can also be debugged, it just requires more effort. Let's discuss these options in detail and I'll show you the simplest debugging method I've encountered in my development experience.

Some alternative ways to debug Node.js

There are some ways to debug problematic Node.js programs. I've listed these methods (with detailed links) below. If you are interested, you can check it out.

• Console.log() — If you’ve ever written JavaScript code, this trusty standby really needs no further explanation. It's built into Node.js and prints in the terminal, just like it's built into JavaScript and prints in the browser console.

In Java language, it is System.out.println(). In Python, it is print(). You see what I mean. This is the easiest to implement, and the fastest way to "dirty" clean code with extra lines of information - but it can (sometimes) also help you find and fix bugs.

• Node.js Documentation—-inspect — The Node.js documentation writers themselves understand that debugging is not easy, so they do some Handy reference to help people get started debugging.

This is useful, but honestly, it's not the easiest to decipher unless you've been writing programs for a while. They quickly got into the trap of UUIDs, WebSockets, and security vulnerabilities, and I started to feel overwhelmed. I thought to myself: There must be a less complicated way to do this.

• Chrome DevTools — Paul Irish wrote a blog post about using Chrome Developer Tools to debug Node.js in 2016 (and in 2018 renew). It looks pretty simple and is a big improvement for debugging.

After half an hour and I still haven't successfully connected the DevTools window to my simple Node program, I'm not so sure anymore. Maybe I just can't follow the instructions, but Chrome DevTools seems to make debugging more complicated than it should be.

• JetBrains — JetBrains is one of my favorite software development companies and one of the developers of IntelliJ and WebStorm. Their tools have a fantastic plugin ecosystem, and until recently, they were my go-to IDE.

With such a professional user base, there are many useful articles for debugging Node, but similar to the Node documentation and Chrome DevTools options, it's not easy. You have to create a debug configuration, attach a running process, and do a lot of configuration in the preferences before WebStorm is ready.

• Visual Studio Code — This is my new gold standard for Node debugging. I never thought I'd say this, but I'm totally invested in VS Code, and every new feature release the team makes makes me love this IDE even more.

VS Code does what all other options in Debugging Node.js fail to do, which makes it foolproof. If you want to get more advanced with your debugging, that's certainly possible, but they've broken it down simple enough that anyone can get up and running quickly, regardless of your proficiency with IDEs, Node, and programming. This is awesome.

Configuring VS Code to debug Node.js

##Okay, let’s configure VS Code to debug Node and start configuring it.

Open

Preferences > Settings and enter node debug in the search box. There should be an extension called Node debug under the Extensions tab. Click the first box here: Debug > Node: Auto Attach, and then set the drop-down box option to on. You are now almost done with the configuration. Yes, it's quite simple.

Now go into the project file and set some breakpoints where you want to see the code pause by clicking on the left sidebar of the file. Enter

node --inspect in the terminal. Now look, something magical happened...

VS Code ongoing code debugging

If you need a Node .js project to test it, you can download my repo. It's meant to test different forms of transferring large amounts of data using Node, but it works great for this demo.

When you hit the

Enter key, the bottom of your VS Code terminal will turn orange, indicating that you are in debug mode, and your console will print something similar to Debugger Information about Attached.

When you see this scene happening, congratulations, you have made Node.js run in debug mode!

At this point, you can see the breakpoints you set in the lower left corner of the screen (and you can toggle the enabled status of these breakpoints through the checkbox), and you can go to debug. At the top center of the IDE there are small continue, step out, step in, rerun, etc. buttons to step through the code. VS Code even highlights the breakpoints and lines you've stopped on in yellow, making them easier to track.

When you switch from one breakpoint to another, you can see the program print out a bunch of

console in the debug console at the bottom of VS Code .log, the yellow highlight will also move with it.

As you can see, as the program runs, the more the debug console outputs, the more breakpoints appear, and in the process, I can Use the tools in the upper left corner of VS Code to explore objects and functions in the local scope, just like I can explore scopes and objects in the browser. good!

It's simple, right?

Summary

Debugging Node.js does not need to be as cumbersome as it used to be, nor does it need to include more than 500

console.log## in the code base # to find out the location of the bug. Visual Studio Code's

Debug > Node: Auto Attach

setting makes this a thing of the past, and I'm very grateful for that. In a few weeks I will be writing some articles about end-to-end testing using Puppeteer and headless Chrome, or resetting passwords in the MERN app using Nodemailer, so follow me so you don’t miss out.

Thanks for reading, I hope this article can help you understand how to debug Node.js programs more easily and effectively with the help of VS Code. Thank you so much for the applause and for sharing my article!

Original address: https://itnext.io/the-absolute-easiest-way-to-debug-node-js-with-vscode-2e02ef5b1bad

Original author: Paige Niedringhaus

Translation permanent link: https://github.com/xitu/gold-miner/blob/master/TODO1/the-absolute-easiest-way-to-debug-node-js-with- vscode.md

Translator: iceytea

For more programming-related knowledge, please visit:

Programming Video

! !

The above is the detailed content of Detailed explanation of how to debug Node.js programs more simply and effectively in vscode! !. For more information, please follow other related articles on the PHP Chinese website!