Set breakpoints and debug node application with Chrome DevTools?

In this post, we are going to understand how to debug node application using chrome dev tools.

Step 1:

Please make sure you are running node application on node version greater than 6.3. If you are using lower version, you can update your node to the higher version.

Step 2:

Usually, we will run our node application as node index.js and now we need to use inspect flag while running.

node --inspect index.js
$ node --inspect index.js
Debugger listening on port 9229.
Warning: This is an experimental feature and could change at any time.
To start debugging, open the following URL in Chrome:
chrome-devtools://devtools/remote/serve_file/@60cd6e859b9f557d2312f5bf532f6aec5f284980/inspector.html?experiments=true&v8only=true&ws=localhost:9229/f68cd621-bdca-4e84-94ba-5467f8a49945

When you run your application using –inspect flag, we will get chrome-devtools URL, Please copy & paste the URL in chrome browser to start debugging.

Step 3:

Open chrome://inspect URL in the Chrome browser. You can able to find your application on the remote target section.

Step 4:

Open the debugging URL in the Chrome browser, we can able to find the node source code in the browser.

In the source tab, we can able to find the total source code of the application. Now we can set breakpoints and debug your application.

In the above example breakpoint set on line number 7. Hit http://localhost:3000/ in another tab and code will break in the application line number 7.