在vscode中调试ts代码

·  阅读 619

说明

最近在使用ts写koa的应用的时候,需要debugger,试了两种调试方法,记录下。

方案一

使用编译后的代码调试,这种方法可以在ts中打断点,然后调试的时候会走到ts代码中,但是如果你想跳入一个方法内部,如果没有在这个方法内部打断点的话,vscode会进入到编译后的js代码里面,这可能不是你想要的。

{
    "type": "node",
    "request": "launch",
    "name": "Launch Program",
    "preLaunchTask": "npm: compile",
    "program": "${workspaceFolder}/src/app.ts",
    "sourceMaps": true,
    "smartStep": true,
    "internalConsoleOptions": "openOnSessionStart",
    "outFiles": [
        "${workspaceFolder}/dist/**/*.js"
    ]
},
复制代码

packege.json中的compile命令

"compile": "rimraf dist/ && tsc --pretty && copyfiles -u 1 src/config/*.json src/*.js dist/"
复制代码

这种方法就是先将ts代码编译成js,然后就可以直接调试没有问题了。

方案二

使用ts-node直接调试,这种方法直接调试ts代码,暂时没有发现其他问题。

{
    "name": "调试代码",
    "type": "node",
    "request": "launch",
    "args": [
        "${workspaceRoot}/src/app.ts"
    ],
    "runtimeArgs": [
        "--nolazy",
        "-r",
        "ts-node/register"
    ],
    "sourceMaps": true,
    "cwd": "${workspaceRoot}",
    "protocol": "inspector",
    "console": "integratedTerminal",
    "internalConsoleOptions": "neverOpen"
}
复制代码

这种方案需要ts-node的支持,所以你需要先install下ts-node才行。

分类:
阅读
标签:
分类:
阅读
标签: