75
34

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

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

Last updated at Posted at 2020-05-22

どちらも

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

75
34
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
75
34

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?