Thomas Segato
Thomas Segato

Reputation: 5265

WebStorm debugger not hitting

I have an Angular 8 project. And I am brand new with WebStorm. I can see in previous versions you need to install a Chrome extensions, but as far as I can see this is not needed any more.

First I click "Run" button with the Angular CLI server selected. It executes an ng serve as expected and I can start a new browser, navigate to localhost:4200 and everything is OK.

Then I click the debugger button and i outputs following:

Debugger listening on ws://127.0.0.1:61543/dd15aef1-4ec6-4611-9496-3bd4f8553e31
For help, see: https://nodejs.org/en/docs/inspector
Debugger attached.

However breakpoints are not hit. Do I need to setup some extra configurations? When reading documentation it looks like everything should be good from start, or have I missed something?

Upvotes: 0

Views: 522

Answers (1)

lena
lena

Reputation: 93878

Looks as if you are trying to debug NPM script used to start your server (ng serve command). This is not a right way to debug Angular application. You need using JavaScript Debug Run configuration with your server URL (localhost:4200) instead:

  • build and start your application with ng serve (in terminal, or by selecting the pre-created Angular CLI server run configuration and pressing Run)
  • select the Angular Application run configuration in configurations dropdown and click Debug

Please see https://blog.jetbrains.com/webstorm/2017/01/debugging-angular-apps/, https://www.jetbrains.com/help/webstorm/2019.2/angular.html#angular_running_and_debugging_debug for instructions

Upvotes: 0

Related Questions