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怎么换主题

vsCode中无法使用npm命令

怎么用vsCode写nodejs

vsCode中终端不能输入怎么办

vsCode怎么修改字体大小

如何彻底清除vsCode以及安装的插件和个人信息

vsCode光标不跟随怎么办

vsCode怎么修改当前工作区默认文件编码

怎么在vsCode中打开cmd

怎么修改vsCode主题颜色

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



打赏

取消

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

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

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

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

评论

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