VSCode调试TypeScript

这种调试方式的优点是直接调试ts文件，无需编译为js及生成map映射文件

安装 npm 依赖包

npm install typescript -g
npm install ts-node -g

配置 tsconfig.json

在项目目录下运行命令tsc --init生成tsconfig.json
在配置中添加 sourceMap:true。

{
    "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "noImplicitAny": true,
        "sourceMap": true
    }
}

配置 launch.json

新建launch.json

编辑launch.json为

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch TS Program",
            //program的值为ts-node模块的执行程序bin.js的文件路径，XXXX是PC用户名，根据自己的电脑用户名修改
            "program": "C:\\Users\\XXXX\\AppData\\Roaming\\npm\\node_modules\\ts-node\\dist\\bin.js",
            "sourceMaps": true,
            "outFiles": ["${workspaceFolder}/**/*.js"],
            "args": ["${relativeFile}"],
            "cwd": "${workspaceRoot}",
            "protocol": "inspector"
        }
    ]
}

调试

1.打开要调试的 ts 文件，添加debugger，设置断点。

2.在debug 选择 launch.json 中对应的配置，点击绿三角(或按F5)运行：

3.成功进入调试模式：