microsoft / vscode-js-debug

A DAP-compatible JavaScript debugger. Used in VS Code, VS, + more
MIT License
1.67k stars 283 forks source link

Mapping breakpoints in a NestJS app built with SWC #2072

Closed mgarnier11 closed 2 months ago

mgarnier11 commented 2 months ago

Describe the bug Hello, I'm having issues mapping the breakpoints back to my source files, in a NestJS application, built with webpack and swc-loader. I can set 2 breakpoints in the same source file, one of them will be correctly mapped to the source file, but the other one will be mapped to the dist/main.js file

image

I dont know how to analyze the log file to check why is it happening, I have correctly loaded it into the vscode-pwa-analyzer, but I dont know what to look for, everything seems fine to me, can anyone point me to the right direction ?

Log File trace.json.gz

VS Code Version: 1.92.2

Additional context I'm using VSCode in a remote host context, it may be related ? but I have been using it like this for months, and i never encountered the problem. When i switch back from swc-loader to ts-loader in my webpack config, I dont have any issue with the debugger, but I would really prefer to be able to use the ts-loader

connor4312 commented 2 months ago

This is an issue in your build tooling.

To set a breakpoint, the debugger reads sourcemaps generated by the tools, and maps the location in your source files to a location in your compiled files. Sometimes, that location might not be a position that a breakpoint can be set on, and when this happens V8 will apply the breakpoint at the closest available location. This is then mapped back using the sourcemaps and the breakpoint is shown in the final position. If there is no valid mapping for the final position, then it's shown in the compiled code, which is what's happening here.

So it sounds like the swc-loader is creating a sourcemap that points to an incorrect location. I would raise this as an issue with them and, if possible, share a source code file, your sourcemaps, and the compiled code so they can diagnose the issue.