vscode怎么调试ts


当前第2页 返回上一页

假如需要调试 /src/main.ts,则此处为 ${workspaceRoot}/dist/main.js。

调试

打开 main.ts,在左侧添加断点,进行调试。

50bccfc1599ef4825fe8c5b96a20e34.png

使用 ts-node 调试 ts 文件

源码:github(https://github.com/meteor199/my-demo/tree/master/typescript/vscode-debug-without-compiling)

来自:Debugging TypeScript in VS Code without compiling, using ts-node

ts-node 调试 ts 文件时,不会显式生成 js。假如你不想编译为 js 后 再调试,可以考虑这种方式。

安装 npm 依赖包

1

2

npm install typescript --save-dev

npm install ts-node --save-dev

配置 tsconfig.json

主要是将 sourceMap 设置为true。

1

2

3

4

5

6

7

8

9

10

11

12

{

    "compilerOptions": {

        "module": "commonjs",

        "target": "es5",

        "noImplicitAny": true,

        "outDir": "./dist",

        "sourceMap": true

    },

    "include": [

        "src/**/*"

    ]

}

配置 launch.json

打开 DEBUG 界面,添加 配置

或者编辑 /.vscode/launch.json。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

{

    "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 文件,添加debugger。

打开 debug 界面。

在DEBUG后 选择 launch.json 中对应的配置,此处为Current TS File。

点击运行按键或者按 F5 运行。

a42798ade7c5eebbc91542c2fcc7d0f.png

相关教程推荐:vscode教程

以上就是vscode怎么调试ts的详细内容,更多文章请关注木庄网络博客

返回前面的内容

相关阅读 >>

vsCode能不能写html

vsCode 如何使用svn

vsCode如何快速补全div标签

vsCode什么按键是后退(撤销)

vsCode怎么选择浏览器

怎么看vsCode的版本

vsCode latex无法预览怎么办

vsCode 搜索不到任何东西怎么办

vsCode跳转到定义失败

vsCode运行程序结果框闪退

更多相关阅读请进入《vsCode》频道 >>



打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...