How do I skip libraries when debugging angular code in VS code

Question

I have an angular project I am attempting to debug however, it steps into @angular/core and ts-lib when I am going through the debugging process. These are huge files with a lot of steps. Is there a way to skip external code?

this is my launch.json:

"version": "0.2.0",
"configurations": [
 {
 "type": "chrome",
 "request": "launch",
 "name": "Launch Chrome against localhost",
 "url": "http://localhost:4200/silverlakeopc",
 "webRoot": "${workspaceFolder}",
 "skipFiles": ["!**/node_modules/**"]
 }
]

}

When I added the "skipFiles" line it now skips over ALL my code. I just want to skip over external libraries.

I have tried:

1. how do I skip external code when debugging in VS Code
2. How Do I Debug An Angular 7 Library in Visual Code
3. How to exclude node modules and node internals from VS --debugger-- ??

Here is a screenshot of my workspace structure:
enter image description here

Answer 1

Using the Chrome Debugging extension in VS Code, I made my launch.json look like this:

{
 "version": "0.2.0",
 "configurations": [
 {
 "type": "chrome",
 "request": "attach",
 "name": "Attach Chrome against localhost",
 "url": "http://localhost:4200/**",
 "webRoot": "${workspaceFolder}",
 "port": 9222,
 "skipFiles": [
 "node_modules/**/*.js",
 "runtime.js",
 "polyfills.js",
 "vendor.js",
 "analytics.js"
 ]
 }
 ]
}

And it seems to do the trick. Most third party code would be in vendor.js I believe.

• Raphael Castro: This works the best. I was actually ignoring the node modules here. I forgot that Webpack bundles all of these dependencies and sticks them into a single file. For that sir. you deserve the win

Answer 2

You can't set it in VSCode but here is a workaround named Blackboxing:

It is a tool that you can use to skip library check for debugging in browser.

To set In Firefox check out here

To set In Chrome check out here

From Chrome v75 and later there is a section named Blackboxing in console settings that you can set scripts there and also it's name is changed to Ignore List in earlier releases.

enter image description here