Help us understand the problem. What is going on with this article?

ts-node と ts-node-dev の違い

どちらも

typescriptでの開発には持って来いなパッケージ達ですが、初めて調べた時、似たような名前でどっちを使えばいいのか結構悩んだので、違いをまとめておきます。

ts-node

ts-nodeパッケージを追加します。

npm install typescript ts-node

typescriptも追加しないと、tsファイルが動かないので、これも追加します。
※グローバルにインストール済みの場合は必要ないです。

tsファイルを作成

src/index.ts
console.log("Hello World");

package.jsonに下記を追加

pacage.json
  "scripts": {
    "ts-node": "ts-node src/index.ts"
  },

実行してみます。

実行結果
npm run ts-node       

> ts-node_t@1.0.0 ts-node C:\Users\ne240\Desktop\work\module_learning\ts-node_t
> ts-node src/index.ts

Hello World

コンパイルなしで結果が出力されました。

オプション

一部オプションを紹介しておきます。

-T, --transpile-only    // 型チェックを行わず、トランスパイル(ts->js)のみ行う
                        // 高速な起動が可能

-P, --project <path>    // tsconfig.ts のパスを指定できる
                        // 1つのプロジェクト内で複数の tsconfig.ts を使用したい時に便利

ts-node-dev

続いて、ts-node-dev
ts-nodeとnode-devの合体版だそうな

ts-nodeと同様にts-node-devを追加します。

npm install typescript ts-node-dev

tsファイルを作成

src/index.ts
console.log("Hello World");

package.jsonに下記を追加
※オプションについては後述

pacage.json
  "scripts": {
    "ts-node-dev": "ts-node-dev --respawn src/index.ts"
  },

実行してみます。

npm run ts-node-dev

> ts-node-dev_t@1.0.0 ts-node-dev <PATH>
> ts-node-dev --respawn src/index.ts

Using ts-node version 8.10.1, typescript version 3.9.3
Hello World

適当にtsファイルの出力文言を変えて保存してみます。

src/index.ts
console.log("Goodbye World");

ソースコードの変更を検知して、自動で変更後のメッセージを出力してくれました。

[INFO] 13:13:44 Restarting: <PATH>\src\index.ts has been modified
Using ts-node version 8.10.1, typescript version 3.9.3
Goodbye World

オプション

こちらもオプションを一部紹介しておきます。

--respawn               // 今回のサンプルのように本来実行して即終了のプログラムも、
                        // 終了せず監視状態になってくれる
                        // 常時起動の待ち受けサーバとかならいらない

--ignore-watch <path>   // 監視対象から除外するファイルを指定
                        // 公式には正規表現が使えるっぽいことが書いてあり試してみたが動作せず…
                        // できた方いれば教えてください。

オプションの指定順は

ts-node-dev [node-dev|ts-node flags] [ts-node-dev flags] [node cli flags] [--] [script] [script arguments]

ちなみに、ts-node-devって長いですよね。
tsndって省略もできるので、こちらも試してみてください。

通知抑制

それから意外と重要なのがこれ

.node-dev.json
{
  "notify" false
}

こいつがないと変更を検知するたびに、こんな感じででかい音と共に通知が飛んできます。
image.png

まとめ

ts-node

tsファイルをjsファイルにコンパイルすることなく、起動することができる

ts-node-dev

tsファイルをjsファイルにコンパイルすることなく、起動することができ、
さらに監視モードで素早く再起動が使用できる

ちなみに、現状nodemonのほうが結構有名かなと思ってるんですけど、nodemonよりts-node-devのほうが大幅に再起動の速度が早いらしい!
(試したわけじゃないですけど、公式に明記してあります。)

参考

npm公式 : ts-node
npm公式 : ts-node-dev

sa9ra4ma
日本
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした