How to watch ts-node and reload on file changes: a guide to errors

How to make ts-node reload on file changes: analyzing real pitfalls

Imagine: you are writing a server in TypeScript, you run ts-node, make an edit — and nothing happens. You have to manually stop the process, press Ctrl+C, and start it again. Sound familiar? This problem has gathered thousands of views on Stack Overflow, and for good reason: setting up watch and reload for ts-node is quite a puzzle.

In this article, I won't just give you a ready-made recipe. We will break down the top errors that even experienced developers make, and I will show you how to avoid them. You will learn why ts-node --watch doesn't work "out of the box", how ts-node-dev is better than the classic approach, and how not to kill server performance in the process.

Why doesn't ts-node reload itself?

Let's set the record straight right away. ts-node is not a dev server. It is a TypeScript-to-JavaScript transpiler that runs code in the Node.js runtime. It has no built-in file watching mechanism. When you write ts-node app.ts, it simply executes the file and exits.

To get automatic reload on file changes, you need to use external tools. And this is where the fun begins.

Top 5 errors when setting up watch and reload for ts-node

I've collected the most common pitfalls that developers stumble over. Let's go through each one with examples and solutions.

Error #1: Using the --watch flag without the right tool

Many people type in the terminal:

ts-node --watch app.ts

And are surprised that nothing works. The thing is, ts-node does not have a --watch flag in its standard distribution. This command is simply ignored or throws an error.

Solution: Use nodemon in conjunction with ts-node. Here is the correct command:

npx nodemon --exec ts-node app.ts

Or, if you want to save it in package.json:

{  "scripts": {    "dev": "nodemon --exec ts-node src/index.ts"  }}

This will make nodemon watch for file changes and restart ts-node on each save.

Error #2: nodemon doesn't see changes in .ts files

You set up nodemon, save a file, but it stays silent. Why? By default, nodemon only watches .js, .json, and some other extensions. .ts is not in the list.

Solution: Specify the extensions explicitly:

nodemon --watch src --ext ts --exec ts-node src/index.ts

The --watch src flag limits the watch scope to the src folder (to avoid watching node_modules). And --ext ts adds TypeScript files to the list of watched extensions.

You can also create a nodemon.json:

{  "watch": ["src"],  "ext": "ts",  "exec": "ts-node src/index.ts"}

Error #3: Conflict with tsconfig.json — incorrect module resolution

A typical situation: you use ts-node with nodemon, but when you start it, you get errors like Cannot find module or Unknown file extension ".ts". Most often, the problem is in the tsconfig.json settings.

Example of a problematic tsconfig.json:

{  "compilerOptions": {    "module": "ESNext",    "moduleResolution": "bundler",    "target": "ES2020"  }}

The problem: ts-node works in the Node.js environment, while module: "ESNext" with moduleResolution: "bundler" are designed for bundlers like Webpa