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

Question

我在调试.ts文件中的角度组件时遇到问题。 我正在使用VSCode和Debugger for 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所在的文件夹。