Debug js when using gulp watch as your web server

PS 141.891

I am using gulp watch which runs a server on port 9000. ie localhost/9000 is the web apps path.  I can debug this app fine using chromes js debuger but I would like to use the debugger in Phpstorm.  I have tried setting up a debug configuration where the url is http://localhost:9000/index.html, I also tried changing the chrome extension port from default to 9000.  Not having any success.

Anyone know how to setup debug configuration the works when gulp is your webserver and not the built in webserver.

If I click on the run it opens the correct page, but if I click on debug it just opens a blank page

I think it is a bug in this build, I tried on a new project with just test.html, right clicked>chose debug test.html and it still opens a blank browser, can anyone else confirm?


1 comment
Comment actions Permalink

Ok got it working my problem was I thought I needed to change the jetbrains chrome plugin port to listen on 9000 as well, but that seems to be incorrect.  After leaving it on the default port it is working.

Just run your normal gulp watch on your port say 9000

Then setup a javascript debug config with url http://localhost:9000

Run watch, set your breakpoints then click on the debug tab


Please sign in to leave a comment.