Using node-inspector with Grunt tasks

JavascriptDebuggingnode.jsNode InspectorGruntjs

Javascript Problem Overview


Does someone used node-inspector with Grunt for application debugging? If not, Can you recommend a debugging tool for Grunt based apps?

I'm working with nodejs for a server side app and I have Grunt to use separated tasks (this is because users can execute tasks separately).

Javascript Solutions


Solution 1 - Javascript

To run grunt in debug, you need to pass the grunt script to node explicitly:

node-debug $(which grunt) task

and put a debugger; line in your task. node-inspector will then open a browser with debugging tools.

Edit 28 Feb 2014

node-inspector has added the command node-debug, which launches node in a --debug state and opens the browser to the node-inspector page, stopping when it hits the first debugger line or set breakpoint.

Edit 30 January 2015

On Windows, things are a touch more complicated. See the answer from @e.gluhotorenko for instructions.

Solution 2 - Javascript

Windows solution

Run

node --debug-brk c:\Users\username\AppData\Roaming\npm\node_modules\grunt-cli\bin\grunt taskname

from cmd in the directory with your Gruntfile.js. Do not forget to put debugger; line in necessary places.

Solution 3 - Javascript

To debug, we have to modify the grunt file under bin. On my machine, grunt is installed globally, so I went to /usr/local/lib/node_modules/grunt/bin I opened the file and modified:

#!/usr/bin/env node

To

#!/usr/bin/env node --debug-brk

--debug-brk will break on the first line of javascript ran.

Doing that alone isn't quite enough though, since you won't be able to find you're grunt task js file in the drop down in node inspector, so you have to modify the file you're interested in debugging by adding debugger; where you want the breakpoint to happen. Now you can click continue after the first break, and you'll break on you're debugger; line

Pretty kludgy, but it's the only way I've found so far.

Solution 4 - Javascript

I recently created grunt-node-inspector to easily configure node-inspector with the rest of your grunt workflow, check it out: https://github.com/ChrisWren/grunt-node-inspector

Here is a section of a Gruntfile which illustrates how you can debug a grunt task using grunt-node-inspector, grunt-concurrent, and grunt-shell: https://github.com/CabinJS/Cabin/blob/master/Gruntfile.js#L44-L77

Solution 5 - Javascript

I have done a task to run my app and launch node-inspector. It is far better than current proposition, you just have to add this task in gruntfile:

  grunt.registerTask('debug', 'My debug task.', function() {
		var done = this.async();
		grunt.util.spawn({
			cmd: 'node',
			args: ['--debug', 'app.js'],
			opts: {
				//cwd: current workin directory
			}
		},
		function (error, result, code) {
			if (error) {
				grunt.log.write (result);
				grunt.fail.fatal(error);
			}
			done();
		});
		grunt.log.writeln ('node started');
		grunt.util.spawn({
			cmd: 'node-inspector',
			args: ['&'],
			opts: {
				//cwd: current workin directory
			}
		},
		function (error, result, code) {
			if (error) {
				grunt.log.write (result);
				grunt.fail.fatal(error);
			}
			done();
		});
		grunt.log.writeln ('inspector started');
	});

Solution 6 - Javascript

Great answers here. In 2017, now you can do

node --inspect --debug-brk $(which grunt) taskName

Which prints something like.

To start debugging, open the following URL in Chrome: chrome-devtools://devtools/bundled/inspector.html?experiments=true&v8only=true&ws=127.0.0.1:9229/232652c3-f63c-4b00-8de9-17dfad5db471

Open that URL in chrome, and you're good to go!

I'm using Node 7.3.0 and I'm on Mac. You might have to follow some of the advice in other posts to get it going on Windows.

Solution 7 - Javascript

2019 update

  • If you want to launch the grunt task in debug mode and break at first line:

    node --inspect-brk $(which grunt) taskName

  • If you want to launch the grunt task in debug mode at a specific port:

    node --inspect-brk=8080 $(which grunt) taskName

  • if you want to attache VSCODE to the node process running the debugging session of grunt, use the following configuration in vscode:

{
  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    
    {
      "type": "node",
      "request": "attach",
      "name": "Attach by port IP 5656",
      "port": 8080
    }
  ]
}

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionJuanOView Question on Stackoverflow
Solution 1 - JavascriptDavid SoutherView Answer on Stackoverflow
Solution 2 - JavascriptEugene GluhotorenkoView Answer on Stackoverflow
Solution 3 - Javascriptuser1577390View Answer on Stackoverflow
Solution 4 - JavascriptChrisWrenView Answer on Stackoverflow
Solution 5 - Javascriptolivier dufourView Answer on Stackoverflow
Solution 6 - JavascriptRoccoBView Answer on Stackoverflow
Solution 7 - JavascriptZEEView Answer on Stackoverflow