How to debug TypeScript in Visual Studio Code

Question

Installing ts-node and typescript locally √
Add a launch.json file √

{
    "name": "Current TS Tests File",
    "type": "node",
    "request": "launch",
    "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
    "args": ["-r", "ts-node/register", "${relativeFile}"],
    "cwd": "${workspaceRoot}",
    "protocol": "inspector"
}

Open up index.ts, and start the debugger...

Process exited with code 1
TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts"

if you don't compile TS file into JS file you can't debug, read the TS VSC doc page — rioV8
– rioV8, Commented May 9, 2022 at 23:54
Does this answer your question? how to debug typescript files in visual studio code — Quentin
– Quentin, Commented Dec 7, 2022 at 11:09

Dorin Botan · Accepted Answer · 2022-05-10 10:28:09Z

0

There is two common options for this.

Use NodeJS:

NodeJS only interprets JavaScript, therefore you will have to cross compile your TypeScript first and enable source maps to use breakpoints. VSCode docs have a thorough tutorial for this.

Use Deno:

Deno interprets TypeScript, therefore it does not require cross compilation. VSCode does not support Deno out of the box, but there is an extension for it, and note that you also need Deno CLI in order for it to work.

answered May 10, 2022 at 10:28

Dorin Botan

1,42310 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to debug TypeScript in Visual Studio Code

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related