调试并重新启动更改 typescript vscode

Question

我想在 typescript 文件上调试和设置断点，并在使用 VSCode 调试器配置进行更改（例如 nodemon watch for changes）时重新启动调试器。

到目前为止，我已经通过 VSCode 运行并重新启动更改而无需调试。

这是我的 launch.json：

{
    "name": "Launch Typescript Server Debugger",
    "request": "launch",
    "type": "node",
    "cwd": "${workspaceRoot}",
    "protocol": "inspector",
    "stopOnEntry": false,
    "program": "${workspaceRoot}/node_modules/nodemon/bin/nodemon",
    "args": [
      "--watch",
      "src/**/*.ts",
      "--ignore",
      "src/**/*.spec.ts",
      "--exec",
      "${workspaceRoot}/node_modules/.bin/ts-node",
      "--inspect",
      "src/app.ts"
    ],
    "restart": true,        
    "env": { "NODE_ENV": "dev"}
  }      

有什么想法吗？

Answer 1

想知道为什么有这么多 WTF cmets 在这个完全自然的问题上。这是我的做法：

我们需要 nodemon 来重启我们的应用程序，我们需要 ts-node/register 来运行我们的 typescrypt，我们需要设置 vscode 的启动器脚本来重新连接调试器应用程序重新编译后。所以安装 nodemon，ts-node 并将这个脚本添加到 package.json：

"watch:debug": "nodemon --inspect=5858 -e ts,tsx --exec node -r ts-node/register ./src/index.ts"

然后在launch.json中添加配置：

{
  "name": "Attach to Process",
  "type": "node",
  "request": "attach",
  "restart": true,
  "port": 5858,
  "outFiles": [],
  "sourceMaps": true
},

就是这样，现在我可以使用 yarn watch:debug 启动我的应用程序并附加调试器。 如果您仍然遇到问题，请查看我的 Github repo here。

Answer 2

您绝对应该查看ts-node-dev 哪个恕我直言在观看编译方面比nodemon 更快，因为它在重新启动之间共享 Typescript 编译过程。下面是示例 vscode launch.json 配置，可让您设置断点（调试）以及在更改时重新加载。

{
  "version": "1.0.0",
  "configurations": [
    {
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
      "name": "Local Server",
      "restart": true,
      "request": "launch",
      "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/ts-node-dev",
      "skipFiles": [ "<node_internals>/**" ],
      "type": "node",
      "runtimeArgs": [ "--respawn" ],
      "args": [ "${workspaceFolder}/src/script/local.server.ts" ]
    }
  ]
}

现在您可以按F5 或使用调试窗格开始调试/实时重新加载。

如果您碰巧使用aws lambda 开发，我为此包装了一个小型库

https://github.com/vcfvct/ts-lambda-local-dev

Answer 3

不使用ts-node，您可以使用此配置在更改时重新启动

task.json

此任务监视 ts 文件并在保存时编译它们

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "typescript",
            "type": "typescript",
            "tsconfig": "tsconfig.json",
            "problemMatcher": ["$tsc-watch"],
            "option": "watch"
        }
    ]
}

然后在launch.json中，

nodemon 在更改时重新加载（在我的情况下，构建文件位于 dist 目录中）

       {
            "type": "node",
            "request": "launch",
            "runtimeExecutable": "nodemon",
            "args": ["--watch", "dist"],
            "name": "Debug TypeScript in Node.js",
            "preLaunchTask": "typescript",
            "program": "${workspaceFolder}/start.js",
            "cwd": "${workspaceFolder}",
            "protocol": "inspector",
            "outFiles": ["${workspaceFolder}/dist/**/*.js"],
            "restart": true
        }

Answer 4

不清楚您到底在问什么，但这可能会有所帮助。 尝试在您的

中添加这些配置

{
 "name": "Current TS File",
 "type": "node",
 "request": "launch",
 "args": ["${relativeFile}"],
 "runtimeArgs": ["--nolazy", "-r", "ts-node/register"],
 "sourceMaps": true,
 "cwd": "${workspaceRoot}",
 "protocol": "inspector",
}

这个配置：

• 在 VS Code 中设置启动当前打开文件的节点任务（${relativeFile} 变量包含当前打开的文件）
• 为节点传递 --nolazy 参数，它告诉 v8 提前编译您的代码，以便断点正常工作
• 传入 -r ts-node/register for node，确保在尝试执行代码之前加载 ts-node
• 将工作目录设置为项目根目录 - ${workspaceRoot}
• 将节点调试协议设置为 V8 Inspector 模式。

我怀疑你错过了

 "runtimeArgs": ["--nolazy"]

在您启动配置时。

Answer 5

这个对我有用。我正在同时使用 Typescript 和 Node。

这是我的 launch.json

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "program": "${workspaceFolder}/src/index.ts",
            "preLaunchTask": {
                "type": "typescript",
                "tsconfig": "tsconfig.json",
                "option": "watch",
                "problemMatcher": [
                    "$tsc-watch"
                ],
                "group": "build"
            },
            "outFiles": [
                "${workspaceFolder}/lib/**/*.js"
            ],
            "runtimeExecutable": "nodemon",
            "restart": true,
            "console": "integratedTerminal",
            "internalConsoleOptions": "neverOpen"
        }
    ]
}