javascript - VS 代码 : "Breakpoint ignored because generated code not found" error

Question

我到处都看过，但在 VS Code 中调试 TypeScript 时仍然遇到问题。我读过this线程，但我仍然无法命中我放置在 TypeScript 文件中的断点，命中 .js 文件中的断点一切正常。

这是我设置的最简单的“hello world”项目。

• 应用.ts:

  var message: string = "Hello World";
  
  console.log(message);
  

• tsconfig.json

  {
      "compilerOptions": {
          "target": "es5",
          "sourceMap": true
      }
  }
  

• 启动.json

  {
      "version": "0.2.0",
      "configurations": [
          {
              "name": "Launch",
              "type": "node",
              "request": "launch",
              "program": "${workspaceRoot}/app.js",
              "stopOnEntry": false,
              "args": [],
              "cwd": "${workspaceRoot}",
              "preLaunchTask": null,
              "runtimeExecutable": null,
              "runtimeArgs": [
                  "--nolazy"
              ],
              "env": {
                  "NODE_ENV": "development"
              },
              "externalConsole": false,
              "sourceMaps": true,
              "outDir": null
          }
      ]
  }
  

我已经通过运行 tsc --sourcemap app.ts 命令生成了 js.map 文件。

在所有这些步骤之后，当我在 console.log(message); 行上设置断点并从“调试”选项卡启动程序 (F5) 时断点变灰并显示“断点被忽略，因为未找到生成的代码(源映射问题？)。”我附上了我所观察到的截图:

我错过了什么？

编辑:

嗨，我仍然坚持这一点。我设法制作了一个遇到断点的示例项目，但在我尝试将该项目复制到硬盘上的其他位置后，断点再次变成灰色并且没有被击中。我在这个测试项目中所做的不同之处在于通过使用 tsc app.ts --inlinesourcemap

编译 TypeScript 文件来使用内联源映射

我把提到的示例项目上传到GitHub，你可以看看here .

Answer 1

设置 "outFiles": ["${workspaceRoot}/compiled/**/*.js"] 为我解决了这个问题。

“outFiles” 值应匹配 tsconfig.json 中的一组 outDir 和 mapRoot，即 $ {workspaceRoot} 在你的情况下，所以尝试 "outFiles": "${workspaceRoot}/**/*.js"

这是我的tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",
        "noImplicitAny": true,
        "removeComments": true,
        "preserveConstEnums": true,
        "sourceMap": true,
        "target": "es6",
        "outFiles": ["${workspaceRoot}/compiled/**/*.js"],
        "mapRoot": "compiled"
    },
    "include": [
        "app/**/*",
        "typings/index.d.ts"
    ],
    "exclude": [
        "node_modules",
        "**/*.spec.ts"
    ]
}

和 launch.json

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "program": "${workspaceRoot}/compiled/app.js",
            "cwd": "${workspaceRoot}",
            "outDir": "${workspaceRoot}/compiled",
            "sourceMaps": true
        }
    ]
}

这是一个小项目，您可以在其中看到所有参数集 https://github.com/v-andrew/ts-template