[开发工具]vscode 直接调试 ts 文件

1、新建一个文件夹”ts-learn”，并建立二级目录src（用于存放ts文件）和dist（存放编译后的js文件）
2、cd进入ts-learn目录
3、安装typescript依赖

npm install typescript --save-dev

4、安装ts-node

npm install ts-node --save-dev

5、在根目录执行tsc --init生成tsconfig.json，并修改为下面这样:

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "noImplicitAny": true,
        "outDir": "./dist",
        "sourceMap": true
    },
    "include": [
        "src/**/*"
    ]
}

6、配置自动编译，利用vscode的tasks自动将ts编译为js。也可以使用别的方式编译，如：gulp, webpack等。
在根目录下添加文件.vscode/tasks.json，内容如下，然后使用快捷键 Ctrl/Comand + Shift + B 开启自动编译。如果不需要自动生成js文件，则这一步可以省略。

{
    // See https://go.microsoft.com/fwlink/?LinkId=733558
    // for thedocumentation about the tasks.json format
   "version": "0.1.0",
   "command": "tsc",
   "isShellCommand": true,
   //-p 指定目录；-w watch,检测文件改变自动编译
   "args": ["-p", ".","-w"],
   "showOutput": "always",
   "problemMatcher": "$tsc"
}

7、配置调试，打开要调试的ts文件，然后点击debug按钮然后点击create a launch.json file创建vscode的laungh.json文件（类型可以选择node-preview)，目录位于根目录/.vscode/launch.json，和tasks.json同目录，内容如下:

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Current TS File",
            "type": "node",
            "request": "launch",
            "program": "${workspaceRoot}/node_modules/ts-node/dist/bin.js",
            "args": [
                "${relativeFile}"
            ],
            "cwd": "${workspaceRoot}",
            "protocol": "inspector"
        }
    ]
}

现在打开要调试的ts文件直接点击运行调试吧。
参考： https://segmentfault.com/a/1190000011935122