Ts-node-dev: Try to debug typescript file

[oshri]

HI Dev,
I try to debug typescript files, in visual studio code.
to run the code I using yarn ts-node-dev server.

Need help :)

configuration:
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "attach",
"name": "Attach by Process ID",
"processId": "${command:PickProcess}",
"port": 5858,
"outFiles": []
},
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"program": "${workspaceFolder}/server.ts",
"preLaunchTask": "tsc: build - tsconfig.json",
"outFiles": [
"${workspaceFolder}/dist/*/.js"
],
"cwd": "${workspaceRoot}"
}
]
}

error:
Cannot connect to runtime; make sure that runtime is in 'legacy' debug mode.

[oshri]

When I add --inspect I get a weird error
command: yarn ts-node-dev --inspect server

[wclr]

does it work without --inspect flag?

[oshri]

No :(

[wclr]

Try to run it without debugger, try to run it with just ts-node (not ts-node-dev), etc..

[francocorreasosa]

Same for me, but with ts-node I get the same result.

[Deilan]

Debug with restart is working for me on macOS 10.13.4 and Node.js 8.9.4 with the following VS Code debug configuration:

{  
   "name":"Launch via nodemon",
   "type":"node",
   "request":"launch",
   "protocol":"inspector",
   "cwd":"${workspaceRoot}",
   "runtimeExecutable":"${workspaceRoot}/node_modules/.bin/ts-node-dev",
   "args":[  
      "${workspaceRoot}/src/index.ts"
   ],
   "restart":true
}

The only issue I've encountered is ts-node-dev won't restart if execution is stopped at a breakpoint.

[oshri]

I found the solution that work for me.

Under .vscode ( folder ) you should create 2 files:

1. launch.json
2. tasks.json

launch.json:

{
    "version": "0.2.0",
    "configurations": [
      {
        "type": "node",
        "request": "launch",
        "name": "Debug TypeScript in Node.js",
        "preLaunchTask": "typescript",
        "program": "${workspaceFolder}/src/index.ts",
        "cwd": "${workspaceFolder}",
        "protocol": "inspector",
        "outFiles": [
          "${workspaceFolder}/lib/**/*.js"
        ]
      }
    ]
  }

tasks.json:

{
    "version": "2.0.0",
    "tasks": [
      {
        "identifier": "typescript",
        "type": "typescript",
        "tsconfig": "tsconfig.json",
        "problemMatcher": [
          "$tsc"
        ]
      }
    ]
}

pacckage.json ( scripts section )

"scripts": {
    "start": "npm run build:live",
    "build:live": "NODE_ENV=development nodemon --exec  ./node_modules/.bin/ts-node -- ./src/index.ts --debug"
  }

To Run you should press Shift + command + B ( Tasks - > Run Build Task ).

[joseluisq]

Just ts-node-dev worked for me (no nodemon or VS code tasks) .

Tools:

• VS Code: v1.29.1
• Node: v10.6.0
• ts-node-dev: ^1.0.0-pre.31

package.json

{
  "scripts": {
    "debug": "cross-env TZ=UTC NODE_ENV=development tsnd --inspect --respawn src/main.ts"
  }
}

launch.json

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "attach",
      "name": "Typescript Server",
      // "processId": "${command:PickProcess}",
      "protocol": "inspector",
      "port": 9229,
      "restart": true,
      "localRoot": "${workspaceFolder}",
      "remoteRoot": "."
    }
  ]
}

Usage:

1. Run your debug NPM task: npm run debug
2. Start VS Code debugging.

[montera82]

@joseluisq thanks, this worked for me!
i wonder how i could make it work with a dockerfile like this

FROM node:9-alpine

ARG APP=/http

WORKDIR ${APP}

COPY . ${APP}/

RUN npm install

RUN npm i -g typescript ts-node-dev [email protected]

EXPOSE 3000

RUN npm run debug

[joseluisq]

@montera82 if you want to debug in docker container check out:
Debugging TypeScript in a Docker Container

Basically, it should works with minimal tweaks.

[gintsgints]

Works fine for me with this launch task:

    {
      "type": "node",
      "request": "launch",
      "name": "Launch server debug",
      "program": "${workspaceRoot}/node_modules/ts-node-dev/bin/ts-node-dev",
      "args": [
        "--inspect",
        "--no-notify",
        "--respawn",
        "--transpileOnly",
        "./src"
      ],
      "protocol": "inspector",
      "internalConsoleOptions": "openOnSessionStart",
      "port": 9229
    },

[stabback]

Expanding on @joseluisq's above -

The solution nearly worked for me. I'm unsure if it's because of my project settings, or if something in the dependencies have changed with time.

The above launch.json settings worked great to attach the debugger, however I found all of my breakpoints were appearing as unverified breakpoint. I could log to the debugger, but couldn't connect direct.

Removing localRoot and remoteRoot and specifying cwd allowed me to use breakpoints.

Updated instructions:

---

Tools
VS Code: v1.33.1
Node: v10.16.0
ts-node-dev: ^1.0.0-pre.40

package.json

{
  ...
  "scripts": {
    ...
    "debug": "ts-node-dev --inspect --respawn --transpileOnly src/main.ts"
  },
  ...
}

.vscode/launch.json

{
    "version": "0.2.0",
    "configurations": [
      {
        "type": "node",
        "request": "attach",
        "name": "Typescript Server",
        "protocol": "inspector",
        "port": 9229,
        "restart": true,
        "cwd": "${workspaceRoot}"
      }
    ]
  }

Usage:

1. Run your debug NPM task: npm run debug
2. Start VS Code debugging.

[M-Zuber]

@gintsgints I tried your solution as I don't want to have to manually run a command and then attach
but my breakpoints are not being hit

Have you run into this?

[gintsgints]

@gintsgints I tried your solution as I don't want to have to manually run a command and then attach
but my breakpoints are not being hit

Have you run into this?

No I have not. Check logs, may be somthing about port settings.

[alexbatis]

Leaving my launch.json file here for anyone who may find it useful:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "ts-node-dev debug",
      "runtimeExecutable": "nodemon",
      "restart": true,
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
      "sourceMaps": true,
      "smartStep": true,
      "args": [
        "--watch",
        "'src/**/*.ts'",
        "--ignore",
        "'src/**/*.spec.ts'",
        "--exec",
        "'ts-node-dev'",
        "-r",
        "tsconfig-paths/register",
        "<src/your_entry_point.ts>"
      ],
      "skipFiles": [
        "<node_internals>/**"
      ]
    }
  ]
}

where __ is the entry point of your application.

This uses tsconfig-paths to register custom paths registered in tsconfig.json.

if your app doesn't use this library, remove the lines :

  "-r",
  "tsconfig-paths/register",

I prefer this method as it doesn't require starting the application in a console then attaching the debugger on a seperate (vscode integrated) terminal. It will launch your application, attach the debugger, and register all breakpoints.

[mannok]

@gintsgints I tried your solution as I don't want to have to manually run a command and then attach
but my breakpoints are not being hit

Have you run into this?

Yes I have run into this...
Windows 10...

[sippeangelo]

Adding to this, currently VS Code seems to be having some issues reattaching. My program crashes with EPIPE: broken pipe, write as VS Code seems to be too slow to reattach on reload before my program starts writing output. I found the fix was to switch to integratedTerminal for the console option in launch.json instead of the default internalConsole

This seems to be working for me so far:

{
    "name": "ts-node-dev",
    "type": "node",
    "request": "launch",
    "protocol": "inspector",
    "cwd": "${workspaceRoot}",
    "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/ts-node-dev",
    "args": [
        "--inspect",
        "--no-notify",
        "--transpileOnly",
        "--respawn",
        "${workspaceRoot}/src"
    ],
    "console": "integratedTerminal",
    "restart": true
}

[davidzwa]

I had to add my server.ts after the last arg "${workspaceRoot}/src"

[Xaz16]

It is how it works for me now, with restart and registered paths from tsconfig.json.

Which troubles I resolved before I get this:

1. Error: ENAMETOOLONG: name too long -- when I use --transpileOnly option I get an error. I used ts-node-dev without vscode debug just in bash. It looks like it is not reproducing all the time...

Command:

node_modules/.bin/ts-node-dev --inspect --respawn --no-notify --transpileOnly --require tsconfig-paths/register ./src/main.ts --inspect-brk=34622 

Output:

Debugger listening on ws://127.0.0.1:9229/715ad179-6f9f-413c-b920-8af6bf7fbfc4
For help, see: https://nodejs.org/en/docs/inspector
Error: ENAMETOOLONG: name too long, open '/tmp/.ts-node73pF36/compiled/____________libs_some_really_long_long_long_long_long_long_long_long_path_to_the_file_index_ts_e3bf35e41e9158318d85cbaf2049ee067732245b2f5a6a06bd0bedc5cbfdb1ab.js812b475326f84.jsonfig_ts_62d4880d8bd64735ec8b9299dfd29f468157af7c7a09a5abf.done'
    at Object.openSync (fs.js:457:3)
    at Object.writeFileSync (fs.js:1298:35)
    at writeCompiled (/node_modules/ts-node-dev/lib/compiler.js:244:10)
    at Object.compile (node_modules/ts-node-dev/lib/compiler.js:271:7)
    at node_modules/ts-node-dev/lib/index.js:129:20
    at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:63:3)

1. node: bad option "--require tsconfig-paths/register" -- silly error without any info about how to resolve it, but it is a quite simple. Do not use it in args array in one element like --require tsconfig-paths/register, use it in 2 different elements "--require", "tsconfig-paths/register"
2. ECONNREFUSED -- in most cases with ts-node-dev lots of issues because you are trying to configure it through runtimeExecutable and runtimeArgs, but for me it works without any headache only if you combine runtimeExecutable and args
3. Error: Cannot use import statement outside a module

(node:27281) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
warning.js:32
src/main.ts:1
import { __awaiter } from "tslib";
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at wrapSafe (internal/modules/cjs/loader.js:1067:16)
    at Module._compile (internal/modules/cjs/loader.js:1115:27)
    at Module._compile (node_modules/source-map-support/source-map-support.js:541:25)
    at Module.m._compile (/tmp/ts-node-dev-hook-1421372891564434.js:59:25)
    at Module._extensions..js (internal/modules/cjs/loader.js:1171:10)
    at require.extensions.<computed> (/tmp/ts-node-dev-hook-1421372891564434.js:61:14)
    at Object.nodeDevHook [as .ts] (node_modules/ts-node-dev/lib/hook.js:61:7)
    at Module.load (internal/modules/cjs/loader.js:1000:32)
    at Function.Module._load (internal/modules/cjs/loader.js:899:14)
    at Module.require (internal/modules/cjs/loader.js:1040:19)

Just put to the tsconfig.json of project that you are trying to compile:
"module": "CommonJS"
Due to node.js do not know about es imports

Summary

ts-node-dev debug config with typescript paths and auto reload:

{
      "name": "Server tools",
      "type": "node",
      "request": "launch",
      "protocol": "inspector",
      "restart": true,
      "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/ts-node-dev",
      "cwd": "${workspaceFolder}/apps/server/tools/${input:toolName}",
      "internalConsoleOptions": "openOnSessionStart",
      "args": [
        "--inspect",
        "--respawn",
        "--no-notify",
        "--require",
        "tsconfig-paths/register",
        "./src/main.ts"
      ]
}

@whitecolor as I can see lots of people comes to your lib after troubles with nodemon through this issue https://stackoverflow.com/a/50528031 and in most cases they trying to setup debugging.

Would it be a good idea to put something like "troubleshooting" section to readme for such folks?

[rochapablo]

I'm getting [ERROR] 15:37:43 SyntaxError: Cannot use import statement outside a module but it does not show here's the problem.

It seems that it's when I try to import sequelize, but I can't see what I'm doing wrong.

[wclr]

@rochapablo probably trying to run some code that contains import inside node js

[filetvignon]

After an extensive amount of trial and error, this config seems to have worked for me:

{
  "console": "integratedTerminal",
  "internalConsoleOptions": "neverOpen",
  "name": "ts-node-dev",
  "restart": true,
  "request": "launch",
  "runtimeExecutable": "tsnd",
  "skipFiles": ["<node_internals>/**"],
  "type": "pwa-node",
  "runtimeArgs": ["--respawn"],
  "args": ["${workspaceFolder}/src/index.ts"]
}