Effortless Nodemon Setup with TypeScript and ESM

Ready to supercharge your Node.js development? Nodemon's got your back! In this tutorial, we'll show you how to set up Nodemon to automatically restart your Node.js app when you make changes to your TypeScript code. Get ready for a faster, smoother development experience.

Contents

• Install Development Dependencies
• Connect ts-node with nodemon

Install Development Dependencies

We include the following development dependencies: TypeScript, nodemon, ts-node, and the essential type definitions for Node.js. Use this command to install them:

npm i --save-dev typescript nodemon ts-node @types/node

The ts-node package performs Just-In-Time (JIT) transformations, converting TypeScript into JavaScript. This allows you to execute TypeScript directly in Node.js without the need for precompilation. It comes with two executables: ts-node for running CommonJS packages and ts-node-esm for running ESM packages.

Here's an example of how to launch an ESM module from its main entry point using ts-node-esm:

ts-node-esm src/main.ts

Alternatively, you can invoke Node directly and instruct it to load ts-node for you using the following command:

node --loader ts-node/esm src/main.ts

This will allow you to pass additional configuration to parameters like max_old_space_size to Node's process:

node --max_old_space_size=8192 --loader ts-node/esm src/start.ts

Note: You also have to use node --loader ts-node/esm instead of ts-node-esm when you get to see this error message:

TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" for ...

This is particularly the case when using ECMAScript modules instead of CommonJS packages.

Connect ts-node with nodemon

Now that we've covered how ts-node works, let's improve your development workflow by integrating nodemon. Nodemon will watch our TypeScript files for changes and automatically reload our code using the most recent modifications, all while running it through ts-node. To achieve this, we need to create a nodemon.json configuration file in the root directory of our project:

{
  "watch": ["src"],
  "ext": "ts",
  "execMap": {
    "ts": "node --loader ts-node/esm"
  }
}

The configuration is easy to read. It instructs nodemon to watch all files within the "src" directory that have a "ts" extension. When such file is found, nodemon will restart the running process using a command we've specified in our execution map (execMap). This map can hold different commands for various file types, but we're only interested in TypeScript files.

Now we can run our application using nodemon, which will operate based on the specified underlying configuration:

nodemon src/main.ts

If you find the "ExperimentalWarning: Custom ESM Loaders is an experimental feature and might change at any time" warning annoying, you can disable it by making a change in the execMap:

{
  "watch": ["src"],
  "ext": "ts",
  "execMap": {
    "ts": "node --no-warnings --loader ts-node/esm"
  }
}

Another option is to use ts-node-esm directly:

{
  "watch": ["src"],
  "ext": "ts",
  "execMap": {
    "ts": "ts-node-esm"
  }
}