How to attach debugger to ts-node command in VSCode

Question

How to attach the VSCode debugger to the ts-node command that uses env variables like the below one:

package.json:

{
"runMyScript": "ts-node -r dotenv/config --transpile-only tasks/migration/myScript.ts dotenv_config_path=./local.env"
}

I tried adding flags --respawn --inspect=4000 to the above command with below launch.json, but it didn't work:

launch.json:

{"configurations": [
    {
      "name": "RUN attach to DEV",
      "type": "node",
      "port": 4000,
      "request": "attach",
      "trace": true,
      "skipFiles": ["<node_internals>/**"],
      "restart": true
    },
]}

FreePhoenix888 · Accepted Answer · 2023-09-12 13:06:19Z

16

Put this json to .vscode/launch.json or add configurations to your existing configurations

{
  "version": "1.0.0",
  "configurations": [
    {
      "name": "TS-Node",
      "type": "node",
      "request": "launch",
      "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/ts-node",
      "runtimeArgs": [
        "--transpile-only",
        // if you use esm
        "--esm" 
      ],
      "program": "${file}",
      "cwd": "${workspaceRoot}",
      "internalConsoleOptions": "openOnSessionStart",
      "skipFiles": ["<node_internals>/**", "node_modules/**"]
    }
  ]
}

Switch to file you want to launch and set breakpoint
Enable Run and Debug window on the left side of VSCode and run this configuration called TS-Node
Congratulations! You are debugging your typescript code 🥳

edited Sep 12, 2023 at 13:06

answered Sep 7, 2023 at 13:09

FreePhoenix888

6,3854 gold badges22 silver badges28 bronze badges

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

Comments

Juarrow · Accepted Answer · 2024-02-17 16:31:50Z

9

From the official documentation: https://typestrong.org/ts-node/docs/recipes/visual-studio-code

{
"configurations": [{
    "type": "node",
    "request": "launch",
    "name": "Launch Program",
    "runtimeArgs": [
        "-r",
        "ts-node/register"
    ],
    "args": [
        "${workspaceFolder}/src/index.ts"
    ]
}],

}

answered Feb 17, 2024 at 16:31

Juarrow

2,4445 gold badges44 silver badges63 bronze badges

Comments

Mike · Accepted Answer · 2022-10-11 06:24:08Z

5

This solution works for me https://gist.github.com/cecilemuller/2963155d0f249c1544289b78a1cdd695

The idea is to use: node -r ts-node/register/transpile-only

{
  ...
  "runtimeExecutable": "node",
  "runtimeArgs": ["--nolazy", "-r", "ts-node/register/transpile-only"],
}

answered Oct 11, 2022 at 6:24

Mike

1,4058 silver badges15 bronze badges

1 Comment

Almenon Over a year ago

Thanks! This worked once I put "module": "Node16", in my compilerOptions

Felix K. · Accepted Answer · 2023-10-20 10:48:35Z

Here is a .vscode/launch.json config that allows you to...

directly execute/debug the npm script specified in package.json
be specific about the node version you want to use (assuming nvm is used)
make use of nodejs v20+ built-in .env file support

Given the following scripts section in your package.json:

"scripts": {
  "start": "node -r ts-node/register --env-file=.myenvfile src/index.ts",
},

You can attach your vscode debugger with the the following launch.json:

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "start",
      "type": "node",
      "request": "launch",
      "runtimeExecutable": "npm",
      "runtimeArgs": ["run-script", "start"],
      "cwd": "${workspaceRoot}",
      "internalConsoleOptions": "openOnSessionStart",
      "runtimeVersion": "21"
    }
  ]
}

See https://code.visualstudio.com/docs/editor/debugging for further reference.

waltermitty · Accepted Answer · 2024-03-14 11:36:30Z

1

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Example",
      "type": "node",
      "request": "launch",
      "runtimeExecutable": "node",
      "runtimeArgs": ["--nolazy", "-r", "ts-node/register/transpile-only"],

      "args": ["src/script.ts", "--example", "hello"],
      
      "cwd": "${workspaceRoot}",
      "internalConsoleOptions": "openOnSessionStart",
      "skipFiles": ["<node_internals>/**", "node_modules/**"]
    }
  ]
}

This works for me.

answered Mar 14, 2024 at 11:36

waltermitty

5133 silver badges17 bronze badges

Comments

Domi · Accepted Answer · 2024-11-10 13:41:49Z

Problem: `MODULE_NOT_FOUND` and `"Cannot find module @myproj/MY_PACKAGE"`

Background: Missing `paths` support

The other solutions do NOT work with TS path mapping, i.e. the paths config option, which is commonly used for allowing cross-referencing packages in monorepos. Those will result in MODULE_NOT_FOUND errors.
TL;DR: This requires a 3rd-party solution. Details:
- Apparently, TS path mapping support is a nightmare to get working across all the possible target systems and environments.
- Hence, TypeScript contributors stated that they don't intend to resolve paths when building.
- Same for ts-node.
One such 3rd-party solution is to add the popular tsconfig-paths into the mix.
- They even have an example of a VSCode launch config in their docs.

Solution

Install tsconfig-paths and ts-node (or tsx) as dev dependencies.

Make sure it works by running things in the terminal first:

cd packages/MY_PACKAGE && npx ts-node -r tsconfig-paths/register src/index.ts

Once you verified that it works, add to launch config:

{
  // ...
  "configurations": [
    // ...
    {
      "name": "ts-node MY_PACKAGE",
      "type": "node",
      "request": "launch",
      "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/ts-node",
      // "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/tsx",
      "runtimeArgs": ["-r", "tsconfig-paths/register"],
      "cwd": "${workspaceFolder}/packages/MY_PACKAGE",
      "program": "src/index.ts"
    }
  ]
}

▶ Run it! (Consider this VSCode Debugging visual explanation if you don't know how.)
- Hint: Make sure to open the DEBUG CONSOLE view to see what's going on. It does not always focus that view automatically:

Notes

tsconfig-paths must reference a tsconfig.json directly. You must either:
- cd into (set cwd to) the path that has the target tsconfig.json,
- or provide TS_NODE_PROJECT.
This works with both tsx and ts-node. tsx is a lot faster but does not do any type checking.
You should not need to set outFiles, since this solution uses injection-based transpilation, i.e. it has the compiled *.js files in memory, and does not write them to disk.
Tangential bonus note: The VSCode launch configuration options don't seem to be properly documented. But one of the many cool things is that you can prompt user for inputs as part of a launch action.

Collectives™ on Stack Overflow

How to attach debugger to ts-node command in VSCode

6 Answers 6

Comments

Comments

1 Comment

Comments

Comments

Problem: `MODULE_NOT_FOUND` and `"Cannot find module @myproj/MY_PACKAGE"`

Background: Missing `paths` support

Solution

Notes

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

Comments

1 Comment

Comments

Comments

Problem: MODULE_NOT_FOUND and "Cannot find module @myproj/MY_PACKAGE"

Background: Missing paths support

Solution

Notes

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related

Problem: `MODULE_NOT_FOUND` and `"Cannot find module @myproj/MY_PACKAGE"`

Background: Missing `paths` support