Search code examples
google-chrometypescriptwebstorm

Debugging Angular 2 application running in lite-server in WebStorm


I have installed Chrome extension "JetBrains IDE Support" and it is running under port 63341.

My package.json script looks like this:

"start": "concurrent \"npm run tsc:w\" \"npm run lite\" "

However, when I run "debug run" in WebStorm, I'm getting a

Connection refused: connect

after a while.

I tried adding -node %NODE_DEBUG_OPTION% to the command, but it doesn't help.

What confuses me is that the "Debugger" tab in WebStorm shows that it's trying to connect to some port on localhost that is always different from 63342 and that disappears right when the error message pops up.


Solution

  • If you like to debug Angular2 application hosted on lite server, you need creating JavaScript Debug run configuration, specify the lite server URL (http://localhost:3000 or whatever it looks like) as URL there, and press Debug. Of course, you need to start the server first by running your npm start script. See https://confluence.jetbrains.com/display/WI/Starting+a+JavaScript+debug+session#StartingaJavaScriptdebugsession-Startingadebugsessionwhenusingadifferentwebserver