VS Code:“断点被忽略，因为未找到生成的代码"错误 [英] VS Code: "Breakpoint ignored because generated code not found" error

问题描述

我到处寻找，但在 VS Code 中调试 TypeScript 时仍然存在问题.我已经阅读了

我错过了什么?

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

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

我已将上述示例项目上传到 GitHub，因此您可以在此处查看.>

解决方案

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

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

这是我的 tsconfig.json

<代码>{编译器选项":{"module": "commonjs","noImplicitAny": 真,"removeComments": 真,preserveConstEnums":真，源地图":真，目标":es6"，"outFiles": ["${workspaceRoot}/compiled/**/*.js"],mapRoot":编译"},包括": [应用程序/**/*"，打字/index.d.ts"],排除": [节点模块"，**/*.spec.ts"]}

和 launch.json

<代码>{版本":0.2.0"，配置":[{类型":节点"，请求":启动"，"name": "启动程序","program": "${workspaceRoot}/compiled/app.js","cwd": "${workspaceRoot}","outDir": "${workspaceRoot}/已编译","sourceMaps": 真}]}

这里是一个小项目，在这里你可以看到所有参数设置https://github.com/v-andrew/ts-template

I have looked everywhere and I still have issue debugging TypeScript inside VS Code. I have read this thread but still I am not able to hit my breakpoints placed inside a TypeScript file, hitting the breakpoints in .js files all works fine.

So here is the simplest "hello world" project I have set up.

• app.ts:

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

• tsconfig.json

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

• launch.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
          }
      ]
  }
  

I have generated the js.map files by running the tsc --sourcemap app.ts command.

After all of those steps when I set a breakpoint on the console.log(message); row and launch the program (F5) from the "Debug" tab that breakpoint is grayed out saying "Breakpoint ignored because generated code not found (source map problem?)." I attached a screenshot of what I am observing:

What am I missing?

Edit:

Hi, I am still stuck on this. I managed to make one sample project that was hitting the break points but after I tried to copy that project to a different location on my HDD the break points again became gray and were not hit. What I did different in this test project was to use inline sourcemaps by compiling the TypeScript files with tsc app.ts --inlinesourcemap

I uploaded the mentioned sample project to GitHub so you can take a look at it here.

解决方案

Setting "outFiles" : ["${workspaceRoot}/compiled/**/*.js"] solved the issue for me.

"outFiles" value should match one set in tsconfig.json for outDir and mapRoot which is ${workspaceRoot} in your case, so try "outFiles": "${workspaceRoot}/**/*.js"

Here are my 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"
    ]
}

and 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
        }
    ]
}

Here is small project, where you may see all parameters set https://github.com/v-andrew/ts-template

这篇关于VS Code:“断点被忽略，因为未找到生成的代码"错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！