Debug console in VS Code with Angular/Typescipt not showing source mapped debug info

Viewed 448

I have an Angular (10) project which I'm debugging from VS Code. I have sourcemaps: true everywhere and I'm able to debug and set breakpoints.

However, in the debug console in VS Code, if I have an error, it doesn't show me line numbers from the sourcemap. If I look in the Chrome debug tools, it does show me the source mapped error e.g. the typescript file and line number, in VS Code I just see main.js e.g.

Chrome console:

Chrome console output

VS Code:

VS Code debug console

Is there a way I can get VS Code debug console to give me the better source mapped output? Here's my launch.json config for debugging in Chrome:

{
    "type": "chrome",
    "request": "launch",
    "name": "Launch Chrome on CLI serve",
    "url": "http://localhost:4201",
    "sourceMaps": true,
    "webRoot": "${workspaceFolder}"
}

0 Answers
Related