How to debug typescript files in vs code when using webpack

Question

I use typescript for nodejs server and I also use webpack and then output server.js file located in build folder not beside server.ts. When I use server.js in launch.json, debugger works and ofcourse hits breakpoints in bundled server.js file. the configuration in launch.json like below:

"name": "Nodemon Launch Server",
"type": "node",
"request": "launch",
"cwd": "${workspaceFolder}/server/build",
"runtimeExecutable": "nodemon",
"program": "${workspaceFolder}/server/build/server.js",
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"outFiles": [
    "${workspaceFolder}/server/build/*.js"
]

but I want to debug ts files and set breakpoint on typescript codes not js. but when I change launch.json program as below:

"program": "${workspaceFolder}/server/server.ts",

it gives this error when I run the debugger:

Cannot launch program '...' because corresponding JavaScript cannot be found.

How can I fix this to debug ts files not webpack bundled js file?

Lajos Gallay · Accepted Answer · 2019-12-02 08:24:52Z

0

The first one you should check is that the source maps has been generated. After that maybe you have to setup outFiles (e..g.:"outFiles": ["${workspaceFolder}/path-to-my-compiled-files/**/*.js"]).

answered Dec 2, 2019 at 8:24

Lajos Gallay

1,3178 silver badges16 bronze badges

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

Collectives™ on Stack Overflow

How to debug typescript files in vs code when using webpack

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related