震惊，vscode还能这么调试typescript?

我们都知道vscode自带调试nodejs环境下的js的功能，比如要打个断点，只需要两步：

1. 打个断点

2. 点击启动程序

3. 查看断点

但是调试typescript就比较麻烦，实际上运行也比较麻烦，我一般用两种方式来运行typescript

1. 用第三方插件，比如插件Code Runner，但是打不了断点
2. 自己装相关库，例如esno，通过package.json的script来调试，可以打断点，但是配置不了运行当前文件，每次都要改运行对象
3. 先编译，再运行，只能在编译产物中打断点

但是上述方法，都比较麻烦。现在推荐一种方式，调试非常方便。

1. 首先安装esno

 pnpm i esno

2. 然后配置launch.json 点击上图按钮，弹出launch.json，然后在configurations里添加：

  {
            "name": "esno",
            "type": "node",
            "request": "launch",
            "args": [
                "./node_modules/esno/esno.js",
                "${file}"
            ],
            "console": "integratedTerminal",
  },

重要的是args的配置，这里我们指定第一个参数是esno的文件地址,实际上调试时是运行node ./node_modules/esno/esno.js xxx.ts，此时我们就能像js那样调试typescript了。 我们打上断点，然后启动esno

然后就能看到能够运行typescript，以及查看断点了: