Debug a Javascript app with the build-in webserver
I want to debug a Vue.js app, that works fine with the built-in server of phpstorm but not when I try to debug using a Debug Javascript configuration. I am not sure if there is a way to make this work.
I have uploaded a video (https://uploads.jetbrains.com/) with the attempt:
Upload id: 2022_04_29_XavFrE6SFu66W3VJ (file: Screencast 2022-04-29 22:09:26.mp4)
Please sign in to leave a comment.
I have tried creating an independent web server like this:
Upload id: 2022_04_29_SNJqmZmv4FQ4qzDu (file: Screencast 2022-04-29 22:36:41.mp4)
But still not able to stop my vueJS app in any breakpoint
On the first screncast, it seems that the debugger can't be attached because the debug port can't be opened - likely because you didn't close all chrome instances prior to starting the debugger: the IDE needs to pass
--remote-debugging-portoption to Chrome in order to attach a debugger; option can't be passed to a running Chrome instance. So, if you have set up Chrome to run with your user data, you need to make sure that no instances that use this data are openas for the second attempt, looks as if the debugger is attached but the actual sources can't be properly resolved, likely because the sourcemaps are either missing or not accurate. Can you share a sample project I can use for investigations?