CODEWITHSUNDEEP
angulardebuggingwebstorm
webworm
webworm

Reputation: 11019

WebStorm debugging Angular CLI app points to localhost:63276

I have an Angular app that I am running via the Angular CLI. I am following the steps listed in JetBrains documentation for debugging an Angular CLI app listed here. When I launch DEBUG mode a new browser opens to about:blank instead of http://localhost:4200 as I had specified in the debug configuration. Also when I look at the debugger tab within WebStorm I see the following ...

enter image description here

Why is WebStorm trying to connect to localhost:63276 when I specified localhost:4200 as the start URL in WebStorm debug configuration?

EDIT: I should mention that in the debug configuration I specify the Chrome browser should use my specified user settings so I have access to LastPass and other browser extensions while debugging

enter image description here

Upvotes: 1

Views: 1148

Answers (1)

lena
lena

Reputation: 93728

63276 is the port debugger is started on, it should not match the port your server is listening on. Please make sure to close all running Chrome instances prior to starting the debugger - as it's written in the error message, debug port can't be opened if you have a running Chrome with your user data. See https://www.jetbrains.com/help/webstorm/configuring-javascript-debugger.html#ws_js_debug_default_chrome_user_data:

To open a new Chrome instance with your familiar look-and-feel, configure Chrome in WebStorm to start with your user data. In this case, before starting a debugging session, always make sure that Chrome is not already running with your user data. Otherwise WebStorm still launches another instance of Chrome with your user data but is unable to open a debugging port for it. As a result, WebStorm debugger fails to connect to the application in the new Chrome instance and the debugging session does not start.

Upvotes: 2

Related Questions