VSCode Debugger & Typescript: Step Over/Into goes to JS file

Question

I'm new to VSCode and I use it for debugging node.js(Typescript) code. Something that I notices it that if my code stops in a breakpoint and then I use the option "Step Over" or "Step Into", the code goes to the post-compiled Javascript file, instead of the relevant Typescript file.

Do you know how to make the debugger go only to Typescript files as a result of using "Step into" / "Step over"?

My settings.json file look this way:

{
            "type": "node2",
            "request": "launch",
            "name": "Launch TS Program",
            "program": "${workspaceFolder}\\app.ts",
            "preLaunchTask": "tsc: build - tsconfig.json",
            "outFiles": [
                "${workspaceFolder}\\**\\*.js"
            ],
            "smartStep": true,
            "outputCapture": "std",
            "console": "internalConsole",
        },

did you find the solution for it?

Shan Khan
– Shan Khan

2019-11-28 04:01:56 +00:00
Commented Nov 28, 2019 at 4:01 — Shan Khan
– Shan Khan, Commented Nov 28, 2019 at 4:01

Diogo Rocha · Accepted Answer · 2019-03-28 11:58:27Z

3

Try to set smartStep to true in your launch config file (launch.json).

You can find more information about this option in the documentation here.

With the smartStep attribute set to true in a launch configuration, VS Code will automatically skip 'uninteresting code' when stepping through code in the debugger. 'Uninteresting code' is code that is generated by a transpiling process but is not covered by a source map so it does not map back to the original source.

answered Mar 28, 2019 at 11:58

Diogo Rocha

10.7k4 gold badges52 silver badges54 bronze badges

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

1 Comment

CrazySynthax Over a year ago

'smartStep' is already set to true, and unfortunately it doesn't help :-(

Aash · Accepted Answer · 2019-05-08 02:34:55Z

2

I had the same issue. I set the following option in my tsconfig.json and then deleted the directory specified by outDir in tsconfig.json.

{
  ...
 "inlineSources": true,                 /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
  ...
}

Then when the project was rebuilt on the next debug, the stepping operations seemed to work fine.

answered May 8, 2019 at 2:34

Aash

333 bronze badges

Comments

Nor.Z · Accepted Answer · 2024-03-13 15:57:21Z

Updated

maybe try to toggle the Enable Source Mapped Stepping in debugger

@command:extension.js-debug.enableSourceMapStepping
@command:extension.js-debug.disableSourceMapStepping

_{^{Old answer & may be wrong
(Might not be relevant, but this worked for me, idk why)
Maybe you can try to open this single project (/ folder) in a new workspace -- with no other projects / folders, just this single one.
And then run the code.

My situation is bit diff -- once I ran the code, the debugger directly jumps to the compiled ts file (yes, a ts file not js, idk why).

(I am using tsx to run the ts code.)

I guess this may due to vscode has some config that tries to search from the default root project dir -- but unable to correctly locate it if you have multi projects in your workspace.

(feels everything was fine for me before, till now.)}}

Collectives™ on Stack Overflow

VSCode Debugger & Typescript: Step Over/Into goes to JS file

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related