DEV Community

0xkoji
0xkoji

Posted on β€’ Edited on

21 7

Auto-reload for Nodejs with TypeScript

I started using TypeScript last August since I joined the team and the team used TypeScript.

My co-worker recommended me to watch one youtube video. I forgot the title... I will put the link if I remember it.

The video was a kind of old one, but it was still useful to understand the overview of TypeScript. At the time I was like "Oh okay, seems legit and pretty nice."

Then started using it for the project and immediately I was like what the hell ?????, are you serious ???? I don't like you, TypeScript.

However, I'm using it because of my job πŸ˜‚, but I have used it for my personal project. I still need to research when TS says something to me via Terminal, but now I kind of like it.

In this post, I will show you how to use hot-reload for nodejs project with TypeScript.

Step 1 Create a nodejs project with Typescript.

Microsoft has a starter kit
https://github.com/microsoft/TypeScript-Node-Starter

If you think that is too much, you can use my template.
https://github.com/koji/typescript/tree/master/node_typescript

Step 2 Install nodemon

$ npm install -g nodemon
$ yarn add global nodemon
Enter fullscreen mode Exit fullscreen mode

Step 3 Install ts-node

$ npm i install -g ts-node # if you prefer npx, you don't need to install it globally
$ yarn add global ts-node
Enter fullscreen mode Exit fullscreen mode

Step 4 Create nodemon.json

We need to create nodemon.json file since nodemon is only working with .js.

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

Step 5 Run nodemon

$ nodemon
Enter fullscreen mode Exit fullscreen mode

Happy coding with TypeScript!!!

Buy Me A Coffee

Image of Timescale

Timescale – the developer's data platform for modern apps, built on PostgreSQL

Timescale Cloud is PostgreSQL optimized for speed, scale, and performance. Over 3 million IoT, AI, crypto, and dev tool apps are powered by Timescale. Try it free today! No credit card required.

Try free

Top comments (5)

Collapse
 
weslleysauro profile image
Weslley Rocha β€’

Well, that's one library called ts-node-dev that makes the reload for you, just call it like ts-node and you should be fine.

Collapse
 
0xkoji profile image
0xkoji β€’

@UΓ©slu, thank you for sharing the info. ts-node-dev looks good!

Collapse
 
hediet profile image
Henning Dieterichs β€’

You should check out my library @hediet/node-reload that brings much more flexible hot reload to typescript node apps!
It can even restart single function calls!

Collapse
 
dorshinar profile image
Dor Shinar β€’

Thanks for the article, but as far as I know this is what's known as cold reload - nodemon would simply shut down and restart your app on every change, causing a loss of state.

Collapse
 
0xkoji profile image
0xkoji β€’

oh, you are right. thanks!
will change the title

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

πŸ‘‹ Kindness is contagious

Dive into an ocean of knowledge with this thought-provoking post, revered deeply within the supportive DEV Community. Developers of all levels are welcome to join and enhance our collective intelligence.

Saying a simple "thank you" can brighten someone's day. Share your gratitude in the comments below!

On DEV, sharing ideas eases our path and fortifies our community connections. Found this helpful? Sending a quick thanks to the author can be profoundly valued.

Okay