VSCode - Chrome调试 - 未验证的断点

Question

我在.ts文件中调试我的角度组件时遇到问题。我正在使用VSCode和Debugger进行Chrome扩展。

这是我的vscode启动文件：

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome",
            "url": "http://localhost:5000",
            "sourceMaps": true, 
            "webRoot": "${workspaceRoot}"        
        }
    ]
}

这是我的tsconfig.json文件：

{
  "compile": true,
  "comments":true,
  "module": "none",
  "target": "es5",
  "sourceMap": true,
  "sourceRoot": "",
  "mapRoot": "",
  "declaration": false
}

在内部角度分量中，我在$ onInit循环中设置了一个断点：

$onInit = () => {
  for(let i = 0; i < 5; i++) { //here I put breakpoint
    let t = i;
  }
}

Debus成功启动（chrome打开）但没有任何反应。在我的编辑器中，如果我将鼠标悬停在断点上，工具提示会显示一条消息：未验证的断点。断点设置但尚未绑定

我使用的是1.24.1版本的vscode。

Answer 1

使用Visual Studio Code > Open Folder...时，请确保打开package.json所在的文件夹。