How can I debug my Meteor app using the WebStorm IDE?

Question

Can anyone provide a short list of steps on how to connect a Meteor app to the WebStorm debugger please?

Answer 1

WebStorm is the only IDE with native support for debugging Meteor server code - check this video. Even on Windows, debugging is very simple:

WebStorm 9+

Go to Run --> Debug --> Edit configurations... , click the plus sign, click "Meteor". You can add environment variable like ROOT_URL if you need to.

---

WebStorm older than 9

This answer is kept only for historical purposes. You should upgrade WebStorm.

On older WebStorms, you used to have to create a Node.js debugging configuration.

• on the server, export the environment variable NODE_OPTIONS=--debug=47977. For instance,

  NODE_OPTIONS=--debug=47977 meteor  # Linux/Mac
  set NODE_OPTIONS=--debug=47977 & meteor`  # Windows
  

• create a WebStorm/PhpStorm Run/Debug configuration using the port above (47977) and the server host. Leave 127.0.0.1 if you're debugging locally.

• in WebStorm, Run -> Debug <myapp>, or press Shift+F9. Make sure that you see "Connected to <your host> in the Debug panel

Now you can set breakpoints, have access to local variables etc.

For client debugging, just use the Chrome debugger, or Firebug.

Troubleshooting

• Process disconnected unexpectedly - this happens when meteor restarts automatically because of lack of specific support for Meteor. Just Run -> Debug <myapp>, or press Shift+F9 again.

• you can't connect to the server - make sure the firewall rules allow incoming connections to whatever port you chose for the Node.js debugger (47977 here).