web-dev-qa-db-ja.com

TypeScriptファイルが変更されたときにts-nodeを監視および再ロードする方法

毎回tsファイルを変換することなく、TypeScriptとAngularアプリケーションを使ってdevサーバーを実行しようとしています。 ts-nodeを使って実行できることがわかりましたが、gulp watchのように.tsファイルを監視してapp/serverをリロードしたいと思います。

typescriptangulargulpdevelopment-environmentnodemon
105
Ieltxu Algañarás

Nodemonのapiを使用してカスタムコマンドを実行するためにデフォルトの動作を変更できることに気付くまで、私は開発環境でも同じことに苦労していました。この例は次のようになります。

nodemon --watch 'src/**/*.ts' --ignore 'src/**/*.spec.ts' --exec 'ts-node' src/index.ts

あるいは、Sandokanが次の内容のnodemon.jsonファイルを推奨し、nodemonを実行してnodemonの設定を外部化し、さらにnodemonを実行します。

{ "watch": ["src/**/*.ts"], "ignore": ["src/**/*.spec.ts"], "exec": "ts-node ./index.ts" }

こうすることで、基盤となる実装を気にせずにts-nodeプロセスをlive-reloadすることができます。

乾杯！

nodemonの最新版に更新されました:

以下の内容でnodemon.jsonファイルを作成します。

{
  "watch": ["src"],
  "ext": "ts",
  "ignore": ["src/**/*.spec.ts"],
  "exec": "ts-node ./src/index.ts"
}
228
HeberLZ

Npmスクリプトを使用して、HeberLZの answer に代わるものがあります。

私のpackage.json：

  "scripts": {
    "watch": "nodemon -e ts -w ./src -x npm run watch:serve",
    "watch:serve": "ts-node --inspect src/index.ts"
  },
  • -eフラグは探す範囲を設定します。
  • -wは監視ディレクトリを設定します。
  • -xはスクリプトを実行します。

--inspectスクリプトのwatch:serveは、実際にはnode.jsフラグです。これは、デバッグプロトコルを有効にするだけです。

39
im.pankratov

私はnodemonとts-nodeを捨てて、もっと良い代替方法ts-node-devhttps://github.com/whitecolor/ts-node-dev を選びました。

ts-node-dev src/index.tsを実行するだけです

36
Mikael Couzic

今回は、tsc-watchライブラリを作成しました。 npm で見つけることができます。

明らかなユースケースは次のようになります。

tsc-watch server.ts --outDir ./dist --onSuccess "node ./dist/server.js"

8
gilamran

"watch": "nodemon --exec ts-node -- ./src/index.ts"のscriptsセクションにpackage.jsonを追加します。

7
TakaSoft

とやった

"start": "nodemon --watch 'src/**/*.ts' --ignore 'src/**/*.spec.ts' --exec ts-node src/index.ts"

糸の開始.. ts-nodeは「ts-node」とは異なります

2
wayan wahyu Adi Putra

あなたが使用することができます ts-node-dev

必要なファイルのいずれかが変更されると（標準のnode-devとして）ターゲットノードプロセスを再起動しますが、再起動の間にTypeScriptのコンパイルプロセスを共有します。

インストール

yarn add ts-node-dev --dev

そしてあなたのpackage.jsonはこのようになるでしょう

"scripts": {
  "test": "echo \"Error: no test specified\" && exit 1",
  "tsc": "tsc",
  "dev": "ts-node-dev --respawn --transpileOnly ./src/index.ts",
  "prod": "tsc && node ./build/index.js"
}
1
jsina

TypeScriptと密接に統合されているtsmonhttps://www.npmjs.com/package/tsmon を使用し、インクリメンタルなトランスパイルとリロード機能を提供します。

私は、ts-node-devをインターフェースの変更を検出できないことに気づくまで使用していました。

インストール

npm install tsmon

TypeScriptプロジェクトフォルダに移動します

tsmon [you .ts file]
0
Ling