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 , or press Shift+F9. Make sure that you see "Connected to 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 , 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).