So I am trying to get VSCode to set a breakpoint in the editor for a standalone project built using the CLI, which uses au run --watch, or npm start to normally run.
When I use F5 to start the project from the editor I can see the source maps in Chrome fine, and can set breakpoints on the TS files there in the browser debug area, but I cannot set any breakpoint inside VSCode itself without the dreaded “unverified breakpoint”.
I tried creating a new project to limit me having broken something and that doesn’t work either.
I have successfully gotten breakpoints to set using the dotnet core asp.net project, but don’t like all the extra noise added to the UI and the WebApi projects that way, but want to keep the in editor breakpoint functionality.
I have tried the changes here to .vscode/launch.json, but to no effect:
Anyone know the secret sauce to get that working? Thanks!
Thought I’d bump this, as I am still looking to see if I can debug in VSCode instead of having to working in the Chrome debug panel.
Vs code debugging works fine for me usually, I didn’t do anything special. Make sure your extension is up to date
Would you mind dropping your launch.json here so I can look at it?
I’m using webpack
// Use IntelliSense to find out which attributes exist for node debugging
// Use hover for the description of the existing attributes
// For further information visit https://go.microsoft.com/fwlink/?linkid=830387
"name": "Attach to Chrome",
I actually have been meaning to try the Edge debugger and the firefox one as Chrome isn’t supported by my customer (private intranet)
So a little on my setup.
Aurelia WebPack/Typescript project
Standard project directory layout
“npm start” to serve files
So I have the Chrome debugger extension installed. 4.10.2
I am able to use the start debugging with the “Chrome” selection and the browser is launched and I can see debug info in the VSCode debug console. However, all breakpoints are basically ignored and marked as unverified when you try to place one.
Only one odd error message in console that seems to be WebPack related:
Failed to load resource: net::ERR_FAILED [http://localhost:8080/sockjs-node/info?t=1539699609575]
Not sure if it matters, but I always run with au run --watch
My understanding is that does the same thing.
A while back using the CLI was broken and I was told to use npm start.
I am in the middle of a release and don’t want to update anything right now and break stuff, but I will see if that does anything.
Thanks for your time, and sharing
Well I’ll be darned, just tried it and it worked!
This is almost always because it can’t find the sourcemaps. The debugger can’t load arbitrary files from the disk so separate map files don’t work. You need to ensure that sourcemaps are inlined.
In Webpack we have:
devtool: production ? 'source-map' : 'inline-source-map',
Thanks @timfish for adding that. Wasn’t the issue in my case, but could be helpful for someone else that is having difficulties with getting breakpoints to work.