466

I'm trying to run a dev server with TypeScript and an Angular application without transpiling ts files every time.

What I found is that I can run .ts files with ts-node but I want also to watch .ts files and reload my app/server. An example of this is the command gulp watch.

22 Answers 22

964

You can now simply npm install --save-dev ts-node nodemon and then run nodemon with a .ts file and it will Just Work:

nodemon app.ts

Previous versions:

I was struggling with the same thing for my development environment until I noticed that nodemon's API allows us to change its default behaviour in order to execute a custom command.

For example, for the most recent version of nodemon:

nodemon --watch "src/**" --ext "ts,json" --ignore "src/**/*.spec.ts" --exec "ts-node src/index.ts"

Or create a nodemon.json file with the following content:

{
  "watch": ["src"],
  "ext": "ts,json",
  "ignore": ["src/**/*.spec.ts"],
  "exec": "ts-node ./src/index.ts"      // or "npx ts-node src/index.ts"
}

and then run nodemon with no arguments.

By virtue of doing this, you'll be able to live-reload a ts-node process without having to worry about the underlying implementation.


And with even older versions of nodemon:

nodemon --watch 'src/**/*.ts' --ignore 'src/**/*.spec.ts' --exec 'ts-node' src/index.ts

Or even better: externalize nodemon's config to a nodemon.json file with the following content, and then just run nodemon, as Sandokan suggested:

{
  "watch": ["src/**/*.ts"],
  "ignore": ["src/**/*.spec.ts"],
  "exec": "ts-node ./index.ts"
}
17
  • 2
    if index.ts is a express instance, how can i kill it and restart
    – hjl
    Aug 23, 2016 at 8:41
  • 30
    you can also create a nodemon.json file with all the mentioned options in it like this: { "watch": ["src/**/*.ts"], "ignore": ["src/**/*.spec.ts"], "exec": "ts-node ./app-server.ts" } and just type nodemon Oct 27, 2016 at 8:27
  • 4
    I made the mistake of adding ./ before the folder names and it broke. This worked for me: { "verbose": true, "watch": ["server/**/*.ts"], "ext": "ts js json", "ignore": ["server/**/*.spec.ts"], "exec": "ts-node index.ts" }. And command line: nodemon --watch server/**/*.ts --ignore server/**/*.spec.ts --verbose --exec ts-node index.ts Mar 11, 2017 at 10:26
  • 4
    I would just like mention, that you also have to set the ext in the config file, so its look for ts changes. My config file look like this: { "watch": ["src/**/*.ts"], "ignore": ["src/**/*.spec.ts"], "ext": "ts js json", "_exec": "node dist/startup.js", "exec": "ts-node src/startup.ts" } Mar 28, 2017 at 8:45
  • 2
    On Windows machines, DON'T use single quotes in your package.json. Replacing those with \" makes the script run fine: "nodemon --watch \"./src/**/*.ts\" -r dotenv/config --exec \"ts-node\" src/index.ts"
    – TJBlackman
    Mar 11, 2020 at 15:27
293

I've dumped nodemon and ts-node in favor of a much better alternative, ts-node-dev https://github.com/whitecolor/ts-node-dev

Just run ts-node-dev src/index.ts

[EDIT] Since I wrote this answer, nodemon has improved a lot, the required config is much lighter now and performance is much better. I currently use both (on different projects, obviously), and am satisfied with both.

18
  • 26
    And why is this better?
    – Deilan
    May 31, 2018 at 20:18
  • 61
    It's faster, and automatically detects which files need to be watched, no config needed. Jun 5, 2018 at 8:36
  • 7
    This is the best (if not the only) option for ts-node, especially for larger projects. It doesn't recompile all files from scratch, but does an incremental compilation, like tsc --watch. Mar 10, 2019 at 22:35
  • 13
    ts-node-dev is a nice idea but it has a lot of problems. It's really just not reliable enough for real-world use. The maintainer seems underequipped to deal with the issues, unfortunately. Back to nodemon I go... Jul 23, 2021 at 20:37
  • 7
    I used this, but eventually I realized it's having major issues with picking up changed files. Saving a file, process is restarted, but somehow old files are still being used. Super annoying. Not an issue with accepted answer.🤷‍♂️
    – Svish
    Nov 4, 2021 at 0:30
77

Here's an alternative to the HeberLZ's answer, using npm scripts.

My package.json:

  "scripts": {
    "watch": "nodemon -e ts -w ./src -x npm run watch:serve",
    "watch:serve": "ts-node --inspect src/index.ts"
  },
  • -e flag sets the extenstions to look for,
  • -w sets the watched directory,
  • -x executes the script.

--inspect in the watch:serve script is actually a node.js flag, it just enables debugging protocol.

7
  • 2
    Also be sure to have typescript locally installed for the project. Otherwise the error you might get is not very clear.
    – Aranir
    Jul 5, 2017 at 10:46
  • I think it should be ts-node --inspect -- src/index.ts now due to this.
    – bluenote10
    Apr 1, 2018 at 22:19
  • 1
    This approach seems to generate considerable superfluous output.
    – Freewalker
    Jun 28, 2019 at 21:12
  • -e ts -w ./src did the trick for me - this worked with a loopback4 CLI generated project Jan 6, 2020 at 8:45
  • 1
    @Timo looks like starting from v5.0.0 for advanced node.js flags (like --inspect in this case) you need to run ts-node as node -r ts-node/register command. Feb 19, 2022 at 11:30
73

Summary of options from other answers

Note that tsx (which uses ESBuild under the hood) and swc don't do type checking; this should be acceptable since most editors have type checking built-in, and type checking should still be part of your build process. You can also do type checking separately alongside your tests or as a pre-push hook via tsc --noEmit.

(Recommended) tsx

ⓘ TL;DR: fastest with minimal configuration

As of 2023-02-01, tsx seems to be the best combination of speed and minimal configuration:

  1. Install tsx

    npm install --save-dev tsx
    
  2. Update your package.json, e.g.

    "scripts: {
      "dev": "tsx watch src/index.ts",
    
  3. Run it

    npm run dev
    

    (Adjust these steps if you just want to install tsx globally and run it directly)

Alternative 1: nodemon/node-dev + ts-node + swc

ⓘ TL;DR: as fast as tsx but with more configuration

An alternative option that combines the reliability of nodemon/node-dev with the speed of ts-node-dev is to use ts-node with swc, a TypeScript-compatible transpiler implemented in Rust which is an "order of magnitude faster" than the TypeScript transpiler.

  1. Install nodemon or node-dev (whichever you prefer)

    • nodemon

      npm install --save-dev nodemon 
      
    • node-dev

      npm install --save-dev node-dev 
      
  2. Set up ts-node with swc integration

    https://github.com/TypeStrong/ts-node#swc-1

    1. Install necessary packages

      npm install --save-dev ts-node @swc/core @swc/helpers regenerator-runtime
      
    2. Add this to tsconfig.json

        "ts-node": {
          "swc": true
        }
      
  3. Run nodemon or node-dev, e.g

    nodemon --watch src src/index.ts
    

    or:

    node-dev src/index.ts
    

Alternative 2: nodemon/node-dev + ts-node transpileOnly

ⓘ TL;DR: fast, reliable

Here's an alternative that's slower than the previous option because it uses the standard TypeScript transpiler, but in my testing it's still faster than nodemon/node-dev + ts-node.

Basically it's the same as the previous option but without swc. It's faster than out-of-the-box ts-node by disabling type checking (see notes above regarding why this should be acceptable).

  1. Install nodemon/node-dev as above

  2. Install ts-node

    npm install --save-dev ts-node
    
  3. Modify your tsconfig.json to enable transpileOnly for ts-node

      "ts-node": {
        "transpileOnly": true
      }
    
  4. Call nodemon/node-dev as above

Alternative 3: nodemon + tsc --incremental

ⓘ TL;DR: fast, reliable, type checking, more finicky

This is nearly the same speed as the previous alternative. The only real advantage of this over the other options is that it does type checking.

In terms of downsides, it can be a bit more finicky; in my testing, I'm using dotenv to pick up my .env file for local development. But depending how your tsc build is configured in tsconfig.json, you may have to do some acrobatics to get it working.

But it's good to have options, so here it is:

  1. Install nodemon as above

    (It's possible that this may work with node-dev as well, but I didn't see an exec option for node-dev)

  2. Configure tsconfig.json to transpile your TypeScript to JavaScript

    In particular, noEmit should not be set to true

  3. Configure nodemon to run the TypeScript compiler to do an incremental transpilation any time a TypeScript file is changed, e.g.

    "dev": "nodemon -e ts --watch src .env --exec \"tsc --incremental && node src/index.js\"",
    

    You can even remove --incremental to further simplify it, but it will end up being much slower, comparable to nodemon/node-dev + ts-node.

6
  • If you install nodemon locally, you cannot run nodemon on cmd. Instead, install it globally with -g.
    – Timo
    Feb 19, 2022 at 10:46
  • 6
    You can still run it without it being installed globally (e.g. node_modules/.bin/nodemon), but given that I almost always need to provide flags to nodemon, it's much more convenient to add a script in package.json that runs nodemon with all the flags I need (as in the example in Alternative 3). That also makes it more convenient when working with multiple projects; you can just call npm run dev and not have to remember how each project needs to be configured. Of course you're more than welcome to install it globally if that suits your fancy.
    – bmaupin
    Feb 22, 2022 at 14:17
  • What do you mean by "type checking should still be part of your build process". And how would I include type checking in my build process? Feb 3 at 2:40
  • @thegoodhunter-9115 The tools recommended by the answers on this page are for local development. But for production, it's generally recommended to transpile the TypeScript to JavaScript, which is the "build" step. If you're using the TypeScript compiler (tsc), it does type checking by default (actually I don't think there's any way to turn it off). Since you might not want to wait until build time to find out if there are any type errors, you could also use tsc to do type checking as part of your testing process or as a pre-push hook.
    – bmaupin
    Feb 3 at 14:39
  • Life saver answer Feb 16 at 11:28
56

This works for me:

nodemon src/index.ts

Apparently thanks to since this pull request: https://github.com/remy/nodemon/pull/1552

4
  • 2
    This works for me too but how? Seems kind of magical. What's compiling the typescript? I don't have ts-node installed.
    – d512
    Dec 11, 2019 at 21:18
  • 2
    @d512 Are you sure it's not in your node_modules/? For me it fails if I don't have it.
    – DLight
    Dec 11, 2019 at 21:41
  • 3
    This indeed does require ts-node to be installed. Running this command without ts-node will result in an failed to start process, "ts-node" exec not found error. You likely had this as a leftover artifact in node_modules. That being said, this solution is much nicer since it doesn't require additional config. May 25, 2020 at 20:45
  • 1
    Install ts-node globally: npm install -g ts-node Sep 9, 2020 at 21:26
21

you could use ts-node-dev

It restarts target node process when any of required files changes (as standard node-dev) but shares Typescript compilation process between restarts.

Install

yarn add ts-node-dev --dev

and your package.json could be like this

"scripts": {
  "test": "echo \"Error: no test specified\" && exit 1",
  "tsc": "tsc",
  "dev": "ts-node-dev --respawn --transpileOnly ./src/index.ts",
  "prod": "tsc && node ./build/index.js"
}
1
  • Thank you! This was the easiest way I found to enable auto reload with my node server. Jun 12, 2020 at 14:47
20

Specifically for this issue I've created the tsc-watch library. you can find it on npm.

Obvious use case would be:

tsc-watch server.ts --outDir ./dist --onSuccess "node ./dist/server.js"

4
  • How would this work in the case of an express or koa server since it doesn't actually kill the previous node instance?
    – brianestey
    Nov 27, 2018 at 3:55
  • 'tsc-watch' kills and restarts the process for you.
    – gilamran
    Nov 28, 2018 at 17:10
  • This is exactly what I was looking for. Not sure what the purpose of ts-node-dev is, but I couldn't get it to report typescript errors. After spending hours trying to get it working, I tried tsc-watch, and it worked like a charm! Jan 16, 2020 at 8:04
  • @gilamran in the documentation of your package there is a typo: "[...] similar to nodemon but for TypeCcript.":) Jan 27, 2020 at 22:26
13

Add "watch": "nodemon --exec ts-node -- ./src/index.ts" to scripts section of your package.json.

9

i did with

"start": "nodemon --watch 'src/**/*.ts' --ignore 'src/**/*.spec.ts' --exec ts-node src/index.ts"

and yarn start.. ts-node not like 'ts-node'

9

I would prefer to not use ts-node and always run from dist folder.

To do that, just setup your package.json with default config:

....
"main": "dist/server.js",
"scripts": {
  "build": "tsc",
  "prestart": "npm run build",
  "start": "node .",
  "dev": "nodemon"
},
....

and then add nodemon.json config file:

{
  "watch": ["src"],
  "ext": "ts",
  "ignore": ["src/**/*.spec.ts"],
  "exec": "npm restart"
}

Here, i use "exec": "npm restart"
So all ts file will re-compile to js file and then restart the server.

To run while in dev environment,

npm run dev

Using this setup I will always run from the distributed files and no need for ts-node.

1
  • Like walking on glass. But an alternative, non-the-less Jun 7 at 19:41
6

The first step - Install the below packages in deDependencies

npm i -D @types/express @types/node nodemon ts-node tsc typescript

or using yarn

yarn add -D @types/express @types/node nodemon ts-node tsc typescript

The second step - using this configuration in your tsconfig.json file

{
  "compilerOptions": {
    "target": "es6" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', 'ES2021', or 'ESNEXT'. */,
    "module": "commonjs" /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */,
    "lib": [
      "DOM",
      "ES2017"
    ] /* Specify library files to be included in the compilation. */,
    "sourceMap": true /* Generates corresponding '.map' file. */,
    "outDir": "./dist" /* Redirect output structure to the directory. */,
    "rootDir": "./src" /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */,

    "strict": true /* Enable all strict type-checking options. */,
    "moduleResolution": "node" /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */,
    "esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */,
    "skipLibCheck": true /* Skip type checking of declaration files. */,
    "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */
  },
  "exclude": ["node_modules"],
  "include": ["./src"]
}

The third step - using these scripts in your package.json file

"scripts": {
    "start": "node ./dist/server.js",
    "dev": "nodemon -L ./src/server.ts && tsc -w"
},
5

add this to your package.json file

scripts {
"dev": "nodemon --watch '**/*.ts' --exec 'ts-node' index.ts"
}

and to make this work you also need to install ts-node as dev-dependency

yarn add ts-node -D

run yarn dev to start the dev server

5

Another way could be to compile the code first in watch mode with tsc -w and then use nodemon over javascript. This method is similar in speed to ts-node-dev and has the advantage of being more production-like.

 "scripts": {
    "watch": "tsc -w",
    "dev": "nodemon dist/index.js"
  },
2
  • 5
    Or just "dev": "( tsc -w & ) && nodemon dist/index.js". May 20, 2021 at 17:13
  • This was a great answer for me. Simple and easy, thanks. Nov 14, 2021 at 21:06
3

STEP 1: You can simple install nodemon and ts-node (skip if you already done)

npm install --save-dev nodemon ts-node

STEP 2: You can configure the start script in package.json

"start": "nodemon ./src/app.ts"

As now nodemon automatically identify the typescript from the project now and use ts-node command by itself. Use npm start and it will automatically compile/watch and reload.

If you get any errors like typescript module not found in the project. simple use this command in the project folder.

npm link typescript
3

ts-node with standard nodejs

Added in Node: v18.11.0, v16.19.0 you can use --watch, no need for nodemon

Added in ts-node: v10.9.1 you can use native integration option for swc compiler. The application starts faster, but your experience may vary.

example

// package.json
{
    "scripts": {
        "dev": "node --watch --loader=ts-node/esm ./src/app.ts"
    },
    "devDependencies": {
        "ts-node": "~10.9.0",
        "@swc/core": "~1.3.0"
    }
}
// tsconfig.json
{
    "ts-node": {
        "swc": true
    },
    "compilerOptions": {
        // ...
    }
}

tsx

Overall, using tsx is a good choice, but it currently does not support emitDecoratorMetadata, which is a dealbreaker for many projects.

2
  • Lots of errors with this for example Caused by: unknown field `noInterop`, expected `resolveFully` at line 1 column 433 Sep 28 at 9:23
  • Please give additional context. What specifically do you mean by "Lots of errors", share your project setup, tooling you are transitioning from, etc.... Sep 28 at 9:48
2

I got this error : code: 'ERR_UNKNOWN_FILE_EXTENSION' i needed the esm support, so if you want ES6 support you can try bellow commands

npm i -D ts-node nodemon

in package.json add below script :

"dev": "nodemon --exec ts-node-esm ./src/index.ts"

1

Just update these 3 packages

nodemon, ts-node, typescript
yarn global add nodemon ts-node typescript

or

npm install -g nodemon ts-node typescript

and now you can run this, problem solved

nodemon <filename>.ts
1
  • Please add your comments or instructions outside of your code. That will be more understandable and readable.
    – vijayP
    Dec 28, 2021 at 13:15
1

Clear logs of the console after changing

Javascript:

"start": "nodemon -x \"cls && node\" index.js",

Typescript:

"start": "nodemon -x \"cls && ts-node\" index.ts",
0

If you are having issues when using "type": "module" in package.json (described in https://github.com/TypeStrong/ts-node/issues/1007) use the following config:

{
  "watch": ["src"],
  "ext": "ts,json",
  "ignore": ["src/**/*.spec.ts"],
  "exec": "node --loader ts-node/esm --experimental-specifier-resolution ./src/index.ts"
}

or in the command line

nodemon --watch "src/**" --ext "ts,json" --ignore "src/**/*.spec.ts" --exec "node --loader ts-node/esm --experimental-specifier-resolution src/index.ts"
0

add --poll options on your package.json

The --poll option in ts-node-dev tells it to check the source code files for changes by periodically looking at them, instead of waiting for the file system to report changes. This ensures that changes to the files are always detected, even on file systems that don't report changes reliably.

   "start": "ts-node-dev --poll src/index.ts"
0

With ts-node-dev version 2.0.0+ you can use:

ts-node-dev --respawn ./src/index.ts

*Note: If you get "command not found" error, then you can run it directly from node-modules like so:

./node_modules/.bin/ts-node-dev --respawn ./src/index.ts
New contributor
Pieris Kimonos is a new contributor to this site. Take care in asking for clarification, commenting, and answering. Check out our Code of Conduct.
-1

With nodemon and ts-node:

nodemon --watch source --ext ts,json --exec "node --loader ts-node/esm ./source/index.ts"

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.