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

6748 ワード
ts-node npm TypeScript Node.js Node.js テキストリンク

どちらも

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       

> [email protected] 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

> [email protected] 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
}

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

まとめ

ts-node

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

ts-node-dev

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

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

参考

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