Recently Paul Irish described how you can debug Node.js applications with Chrome DevTools.
Since that time Chrome DevTools have evolved and the step, where you had to open the separate page with a specific URL to debug the Node.js code, was removed.
Let’s take a look how it works.
What you need
1) Node.js 6.3+
Better to you use 6.6+ as Paul Irish mentioned in the comment, “in 6.4 there are a few flaky bugs”.
2) Chrome 55+
For that, you can download Chrome Canary
If you are using Atom, try this https://atom.io/packages/node-debugger
Enable a new way of Node.js debugging in Chrome
To enable it, you have to do the following:
- Open the chrome://flags/#enable-devtools-experiments URL
- Enable the
Developer Tools experimentsflag
- Relaunch Chrome
Experimentstab (it started being visible after the reload)
"SHIFT"6 times (enjoy it ¯ \ _ (ツ) _ / ¯) to show the hidden experiments
- Check the
- Open/close DevTools
To start debugging, just open your page in Chrome and DevTools, as usually.
Start Node.js app
Start the Node.js in the debug mode. For that add the
--inspect argument. E.g.:
node --inspect node.js
If you do this, you’ll see the output from Node.js, that it started in debug mode and an option to inspect the process opening a separate URL in Chrome:
Debug in DevTools
If you have any console.log or similar output in your Node.js application (outlined with blue on the previous image) , you can notice, that it already appeared in Chrome DevTools console:
I prepared a demo:
It contains a usual static server using Node.js (
node.js file) and a page which just makes fetch requests to the pointed URL (the code is in the
You can try it to see how easily you can debug Node.js in Chrome. Just download the demo code from Github and run
node --inspect node.js in its folder.
After that open
http://localhost:8033/ in Chrome and so you can debug both
node.jsthe same time:
As you see, you can put breakpoints in the Node.js code and output from Node.js apps goes to the DevTools console.
But there are many other abilities:
- Live Edit: you can not only debug, but also change the files content
- Take snapshots etc.
You also can use all the power of Chrome DevTools applying it to Node.js code.
NodeJS inbuilt debugger: https://nodejs.org/api/debugger.html