Debugging node app in WebStorm when run from gulp - node.js

I am using webstorm 10.0.2 and have used the bangular yeoman template to generate a project. I can run the gulp commands via the gulp window, and I can set a breakpoint in the gulpfile.js and it will hit it, but I can't seem to get it to hit a breakpoint in my server.js
It looks to me like the gulp file is launching another instance of node and thus when you do "debug" from webstorm you are just debugging the gulp.
I also tried with another project using yo hottowel but get the same thing - I am unable to debug the actual application through webstorm.
Can anybody tell me how to configure webstorm so that I can debug the actual server side node code but still use the gulp build tool?

I contacted JetBrains support back in May 2015 and their response was:
It seems this cannot be done quickly. In short, the problem is that serve-dev task starts new process (nodemon) that takes app.js
There is no workaround how to debug such spawned processes right now. We would really appreciate if you'll submit a feature request about it in our YouTrack: https://youtrack.jetbrains.com/issues/WEB
The only way you can try to avoid it - try to create a separate task that will run app.js directly without nodemon process and debug this task instead.

It seems the best option is to use https://www.npmjs.com/package/gulp-node-inspector

Related

Vue JS Intellij setup

I am working on a Vue js application but am having difficulty getting it to run/debug within IntelliJ. I am currently running it from the command line but I'm interested in getting it to debug in IntelliJ. Not many tutorials out here on getting this set up to work. Is there anyone that has experience in setting up this framework and IDE?
Steps are rather straightforward and described in blogpost:
First, install the JetBrains IDE Support Chrome extension. This will bind the browser debugger environment with IntelliJ in real-time.
start the server with npm serve (can be done from a gutter in package.json):
create a new JavaScript debug configuration, specify the URL your app is running on (usually http://localhost:8080) in it, put the breakpoints right in the source code, and start the debug session.
See also https://blog.jetbrains.com/webstorm/2019/03/get-started-building-apps-with-vue-js-in-webstorm/ for some hints on working with Vue.js in IDEA. And https://medium.com/dailyjs/stop-painful-javascript-debug-and-embrace-intellij-with-source-map-6fe68eda8555
You can add "Run Configuration" for any project to run in Intellij. For this, you must have a run script in package.json.
Refer below link for a screenshot. NPM Run Configuration Sample:
Choose NPM and give like this. Once done, you are all ready for clicking the RUN button available in the toolbar to run the project

How do you set up file watcher in Webstorm to restart Node.js?

What I am trying to achieve is to trigger same behavior as Menu option Run > Run 'server.js'
Please try using Live Edit here - see http://blog.jetbrains.com/webstorm/2014/08/live-edit-updates-in-webstorm-9/. It allows re-starting node.js application on changing the code
You need to integrate webstorm with nodemon instead of the main node program. Basically nodemon is in charge of restarting your application and not webstorm.

Node.js server debuging with WebStorm (grunt)

I'm using grunt to launch my server with livereload and other tasks.
I've followed this and this post to run my grunt tasks.
It's working but I can't debug properly (when I set some breakpoints, there aren't hit)
When I launch the script, here is what I got:
As you can see the debugger appears in a 2nd tab, but it's not doing anything. (even if it says it's connected successfully).
To debug my app I've to stop this 2nd tab, and run a remote debugger... Anyway to fix this?
Additional info: The server is run in another process. If I run it in the same process as grunt, there are no issues.
What Node.js version do you use? In 0.10.x the child process occupies the same port as a master process, so debugging won't work by default. Related ticket: https://github.com/joyent/node/issues/5318. Can you check if it works for you using Node.js ersion >= 0.11.4? Also, what Grunt tasks are being used?
As mentioned by lena, the issue seems to be fixed in WebStorm 8.

Use nodemon or supervisor to reload only the files without restart all the server - WebStorm

I just took a look to this tutorial: How can I run nodemon from within WebStorm?
I'm wondering how reload only the files updated and don't restart the entire server instance.
I'm wondering also if it's possible to don't break a debug breakpoint, because for the moment the entire server is restarted and if I'm following instruction step by step using the debogguer, I lost the track.
By the way, there are my ways to use them with webstorm, it's particularly tricky with supervisor. Because it needs to get the app.js and everything as parameters.
Supervisor: https://docs.google.com/file/d/0ByzbHcAxmCyvTGdHOWJSTTYzNWs/edit
Nodemon: https://docs.google.com/file/d/0ByzbHcAxmCyvdVQ3azFhSlV0dEU/edit
You can use modules like hotswap to reload files when they change.
It can cause memory leaks and other stuff, but it's working fine for development.

Webstorm: debugging node.js sails app

I'm having a hard time finding the right combination of settings to allow me to debug my node.js sails application in webstorm.
These are the settings I've tried using, both configurations work (as in sails starts) but none is stopping at breakpoints.
If I go to the breakpoints menu and turn on 'Any exception enabled' - it does stop for exceptions, but never hits my breakpoints.
Any ideas? I'm on webstorm 7.0.1 and Node 0.10.18 / Sails 0.9.7
You don't need the --debug in node parameters. Here is my config and i am on 7.0.1 and node 0.10.4
Let me know if it helped. Also, you are hitting the bug to run debug right?
Also, can you please invalidate caches/ restart? That helps sometimes. Here is a snapshot in the file menu.
I had the same problem and simply installed sails local to the project and everything worked fine. Not sure why the configuration can't resolve the globally installed sails as that is the error I was getting, but the local install works fine. I should investigate further, but I'm lazy :)
When you open a new project on WebStorm, it detects the package.json file and it will ask you to install the dependencies locally. After that, by using the configuration mentioned before (not necessarily by using sails lift but using app.js directly instead), you can debug you application from WebStorm. Another way to do it, is by using this tool, that works like a charm: https://github.com/node-inspector/node-inspector :)

Resources