Angular Debugging In VS Code

    1 minute read

    Angular Debugging in VS Code

    Debugging Angular applications effectively can significantly enhance productivity and streamline development. In this post, we’ll explore how to set up and troubleshoot Angular debugging in Visual Studio Code (VS Code) on Windows 10. We’ll cover setting up launch.json and tasks.json configurations.

    • .vscode
      • launch.json
      • tasks.json

    launch.json

     1{
 2  "version": "0.2.0",
 3  "configurations": [
 4    {
 5      "name": "Start & Launch Edge",
 6      "type": "msedge",
 7      "request": "launch",
 8      "preLaunchTask": "npm: start",
 9      "url": "http://localhost:4200/",
10      "webRoot": "${workspaceFolder}\\ClientApp",
11      "sourceMaps": true,
12      "sourceMapPathOverrides": {
13        "webpack:///./*": "${webRoot}/*"
14      }
15    },
16    {
17      "name": "Launch Edge",
18      "type": "msedge",
19      "request": "launch",
20      "url": "http://localhost:4200/",
21      "webRoot": "${workspaceFolder}\\ClientApp",
22      "sourceMaps": true,
23      "sourceMapPathOverrides": {
24        "webpack:///./*": "${webRoot}/*"
25      }
26    }
27  ]
28}

    tasks.json

     1{
 2  "version": "2.0.0",
 3  "tasks": [
 4    {
 5      "label": "npm start",
 6      "type": "npm",
 7      "script": "start",
 8      "isBackground": true,
 9      "options": {
10        "cwd": "${workspaceFolder}/ClientApp"
11      },
12      "presentation": {
13        "focus": true,
14        "panel": "dedicated"
15      },
16      "group": {
17        "kind": "build",
18        "isDefault": true
19      },
20      "problemMatcher": {
21        "owner": "typescript",
22        "source": "ts",
23        "applyTo": "closedDocuments",
24        "fileLocation": ["relative", "${cwd}"],
25        "pattern": "$tsc",
26        "background": {
27          "activeOnStart": true,
28          "beginsPattern": {
29            "regexp": "(.*?)"
30          },
31          "endsPattern": {
32            "regexp": "Compiled |Failed to compile."
33          }
34        }
35      }
36    }
37  ]
38}