Visual Studio Code 中的 Typescript 调试答案

【问题标题】：Typescript debugging in Visual Studio CodeVisual Studio Code 中的 Typescript 调试
【发布时间】：2016-12-29 09:44:51
【问题描述】：

我尝试了这个解决方案：how to debug typescript files in visual studio code

但是，如果我在 .ts 文件中设置断点，则表示找不到用于调试器的文件。 .js 文件中的断点有效。 Sourcemaps 存在。

启动配置：

    {
        "name": "DEBUG",
        "type": "node",
        "request": "launch",
        "program": "${workspaceRoot}/src/app.ts",
        "stopOnEntry": false,
        "args": [],
        "cwd": "${workspaceRoot}",
        "preLaunchTask": null,
        "runtimeExecutable": null,
        "runtimeArgs": [
            "--nolazy"
        ],
        "env": {
            "NODE_ENV": "development"
        },
        "externalConsole": false,
        "sourceMaps": true,
        "outDir": "${workspaceRoot}/cmpl"
    }

【问题讨论】：

标签： node.js visual-studio typescript visual-studio-code

【解决方案1】：

几个建议让它发挥作用：

确保您的 tsconfig.json 指向正确的 src/ 和输出目录，例如

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es6",
        "sourceMap": true,
        "rootDir": "src",
        "outDir": "cmpl"
    }
}

您应该有一个构建任务 (.vscode/tasks.json) 以确保输出是最新的

{
    "version": "0.1.0",
    "command": "tsc",
    "isShellCommand": true,
    "args": ["-p", "."],
    "showOutput": "silent",
    "problemMatcher": "$tsc"
}

在你的 launch.json "preLaunchTask": "tsc"

【讨论】：

到 tsconfig。它确实如此，如果没有的话将能够启动服务器。服务器运行，但我无法在 .ts 文件中设置断点。并且构建任务也有效。
@R3Tech 嗯，这很奇怪。在这一点上，如果不仔细检查项目就很难说:)
我有一个 cmpl 和 src 文件夹。这是 app.ts/js 文件和文件夹，如路由、控制器、模型等。在我的根目录中，cmpl 和 src 文件夹所在的位置是 tsconfig、package.json、gulpfile.js 和其他项目文件。
那么我认为您将断点放在不同的文件而不是 app.ts 中？我建议尝试在 app.ts 中放置断点并跟踪它们以找出您不能再打断点的地方。

【解决方案2】：

这是您的 tsconfig.json 的问题。您必须检查配置是否包含正确的 sourceRoot 编译器选项设置为您的 .ts 源的正确路径。

sourceMap 也必须设置为 true。您可以仔细检查路径的正确性，检查您的任何 .js.map 文件，其中 sources 和 sourceRoot 字段必须指向您的 .ts 源文件的正确路径。

【讨论】：

您是否检查了您的任何.js.map 中的.ts 文件的路径？是相对的还是绝对的？它指向正确的位置吗？
例如，我的 IndexController 中的源映射是 "sources":["controllers/IndexController.ts"]
相对于您的 IndexController.js.map，IndexController.ts 文件是否位于“controllers”文件夹中？看起来您的配置指向 .js 和源的不同文件夹。
IndexController.js/.js.map 在./cmpl/controllers 和IndexController.ts 在./src/controllers
您可以在您的 tsconfig sourceRoot: "src" 中设置 sourceRoot 编译器选项