vscode 调试 typescript

运行typescript

正常情况下typescript 需要被编译成js后再手动运行，十分麻烦。
我们可以用npm全局安装ts-node来直接运行.ts文件，十分优雅。

npm install -g ts-node  

调试typescript

当我们遇到一个比较难的题的时候，就需要调试发现问题的病症。
普通的js文件我们安装node后会自动有调试环境。直接按F5然后选择Node，即可开始调试。


但是typescript不行。我们需要手动创建launch.json

然后输入以下配置

{
    "version": "0.2.0",
    "configurations": [

        {
            "name": "Current TS File",
            "type": "node",
            "request": "launch",
            "program": "/root/.nvm/versions/node/v16.13.2/lib/node_modules/ts-node/dist/bin.js",
            "args": [
                "${relativeFile}"
            ],
            "cwd": "${workspaceRoot}",
            "protocol": "inspector"
        }
    ]
}   

我们查看其中的program字段，实际上它是用ts-node这个包里面的bin.js来实现的调试。
我的bin.js的文件目录在 /root/.nvm/versions/node/v16.13.2/lib/node_modules/ts-node/dist/bin.js

但是你的bin.js目录可能会不一样。你需要把它改变为你的目录。
查看方式是在命令行里输入

npm prefix -g  

然后就会返回你的node的安装路径。

然后你再根据我给出的bin.js路径慢慢找吧，应该都是差不多的。
或者你可以试试我写的这个小shell脚本，运行即可获取。

echo "$(npm prefix -g)/lib/node_modules/ts-node/dist/bin.js" 

2023/1/23日更新

最新换了新的WSL2，系统换成了Ubuntu22.04lts。
最近重新配了一下typescript的调试环境。
发现了几个值得参考的链接:
https://github.com/TypeStrong/ts-node#visual-studio-code
https://marketplace.visualstudio.com/items?itemName=kakumei.ts-debug