0%

vscode调试typescript项目

发表于 更新于 分类于

前端利器VS Code,不只是可以开发DIV/CSS还可以开发nodejs typescript，这次我们介绍下如何配置使用vscode调试 typescript代码

全局安装ts-node

1
2
# 在终端执行
sudo npm i -g ts-node typescript # 已经安装过可以忽略

开启vscode的 自动附加模式

在编辑器主界面，执行快捷键 ctrl+shift+p，输入 Toggle Auto Attach 回车

开始调试

方式一

在 package.json 中增加 debug 启动脚本 node –inspect-brk -r ts-node/register src/main.ts

注意，最后的参数 src/main.ts 是程序的入口，可自行修改适配到自己的项目中

方式二

直接修改 .vscode 下的 launch.json 文件 需改为：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
{
    // 使用 IntelliSense 了解相关属性。 
    // 悬停以查看现有属性的描述。
    // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Koa Program",
            "runtimeArgs": [
                "--nolazy",
                "-r",
                "ts-node/register",
            ],
            "args": [
                "${workspaceFolder}/app/app.ts"
            ],
            "env": {
                "DEBUG": "yuedun:*,-not_this",
                "NODE_ENV": "development"
            },
            "sourceMaps": true,
            "cwd": "${workspaceFolder}",
            "protocol": "inspector",
            "console": "integratedTerminal",
            "internalConsoleOptions": "neverOpen"
        }
    ]
}