Unbound breakpoints in Vscode 1.64.2

Question

I'm using vscode with Angular, and I'm unable to set breakpoints that trigger. All breakpoints are set as unbound breakpoints.

My environment:

Version: 1.64.2 (user setup) Date: 2022-02-09T22:02:28.252Z Electron: 13.5.2 Chromium: 91.0.4472.164 Node.js: 14.16.0 V8: 9.1.269.39-electron.0 OS: Windows_NT x64 10.0.22000

my launch.json

{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [

    {
      "name": "ng serve",
      "type": "chrome",
      "request": "launch",
      "preLaunchTask": "npm: start",
      "url": "http://localhost:4200",
      "webRoot": "${workspaceFolder}", 
      //"sourceMaps": 
      "resolveSourceMapLocations": [
        "${workspaceFolder}/**",
        "!**/node_modules/**"
    ],
    "outFiles": [
        "${workspaceFolder}/**",
        "**/node_modules/**"
      ],
    "trace": true
    },
    {
      "name": "ng test",
      "type": "chrome",
      "request": "launch",
      "url": "http://localhost:9876/debug.html",
      "webRoot": "${workspaceFolder}",
      "sourceMapPathOverrides": {
        "./src/*": "${workspaceFolder}/src/*"
      }
    },
    {
      "name": "ng e2e",
      "type": "node",
      "request": "launch",
      "program": "${workspaceFolder}/node_modules/protractor/bin/protractor",
      "args": ["${workspaceFolder}/e2e/protractor.conf.js"]
    },
    
  ]

}

I've tried a number of things that I've found on stackoverflow and various documents :

added sourcemap: true in tsconfig.json

{ "compileOnSave": false, "sourceMaps": true, "compilerOptions": { "baseUrl": "./", "outDir": "./dist/out-tsc", "forceConsistentCasingInFileNames": true, "strict": true, "noImplicitOverride": true, "noPropertyAccessFromIndexSignature": true, "noImplicitReturns": true, "noFallthroughCasesInSwitch": true, "sourceMap": true, "declaration": false, "downlevelIteration": true, "experimentalDecorators": true, "moduleResolution": "node", "importHelpers": true, "target": "es2017", "module": "es2020", "lib": [ "es2020", "dom" ] }, "angularCompilerOptions": { "enableI18nLegacyMessageIdFormat": false, "strictInjectionParameters": true, "strictInputAccessModifiers": true, "strictTemplates": true } }
added the following in angular.json "vendorChunk": true, "extractLicenses": false, "buildOptimizer": false, "sourceMap": true, "optimization": false, "namedChunks": true
added the resolveSourceMapLocations option in lauch.json settings for 'ng serve'.
added outfiles option in launch.json settings for 'ng serve'.

None of these have worked and my breakpoints still remain unbound, even when my angular component with the breakpoint is loaded.

Question : How do I enable debugging in VSCode for angular so that breakpoints are not unbound and breaks at the breakpoint ?

Unbound breakpoints in Vscode 1.64.2

Answers (1)

Related Questions