Node.jsモノレポ開発のターミナルログ混雑解消のための新作CLIツールnotiosを紹介

2022/04/25に公開

notios

こんにちは。フルーリオ株式会社のlumaです。

Node.jsプロジェクトで開発をする際に役立つフルーリオ株式会社の新作CLIツール notios の紹介をします。

demo

https://github.com/frouriojs/notios

notiosの読み方は「ノーティオス」です。

対象読者

  • Node.jsでモノレポでの開発をしている
  • npm-run-allを利用している
  • Node.js開発で開発コマンド(next devnodemonnode-dev)stdoutとstderrが混在しているのを解消したい

すぐに導入したい人はこちら

  • npm-run-all を利用している場合は、 npm remove npm-run-all
  • npm install -D notios
  • package.json が置いてあるディレクトリで npx notios

yarnpnpm でも問題なく使用できます。また、 npx notios 経由で起動していない場合は、 npm-run-all がそのまま使用されます。

その他のアドバイス

  • npm-run-all を使用していないプロジェクトでは、 npm run script1 && npm run script2 のようなスクリプトを、 run-s script1 script2 に書き換えることでより親和性の高い表示になります。 run-s , run-p , npm-run-all の使い方については、npm-run-all のドキュメントを参照してください。
  • npm-run-all とは書き方は基本的に互換性がありますが、一部互換性がありません。 run-p 'build:* -- --production' のような書き方ができなくなるなどがあります。

モチベーション

Node.jsでモノレポでWebアプリケーションを開発するといったようなことも増えてきているかと思います。Web以外でも、ライブラリやフレームワークなどで有名所がモノレポ構成になっていることは珍しくありません。

そういったNode.jsプロジェクトでは多くの npm-run-script を定義することになります。そして、大抵は簡単にスタートができるように、それをまとめる devstart のようなスクリプトが定義されているかと思います。そこで役立つのが npm-run-all です。 npm-run-all は非常に多くのプロジェクトで使われており、デファクト級であるのは疑う余地もないかと思います。

そんな npm-run-all ですが、あまりに多くの並列実行をしていると、一つが異常終了したことですべて止まってしまったり、その際にどのスクリプトのエラーかわからなくなったりすることがたびたび起きました。一つの解決策は、 npm-run-all-l フラグで、これはどのコマンドによる出力かを併記してくれるオプションです。

フルーリオでは、この問題を一度フラットに考え直し、実はシンプルな方法があるのではないかと考えてみました。そこで今回新たに、 npm-run-all を拡張する形で作成したのが notios です。

notios では、インタラクティブなターミナル上のUIでスクリプトの実行・ログ確認をします。問題となっていた異常終了してしまったスクリプトを個別で再開したり、ターミナルログを個別に確認することが可能です。また、ラベル機能も持ち合わせており、 npm-run-all では色がつかなくなってしまう問題も解消しています。

notiosのインストール

notiosはnpm-run-allと同名の3つのコマンドに加えて、notiosコマンドと、衝突を避けるための n- プレフィックスがついた3つのコマンドが同封されています。

npm-run-allを利用している場合は、npm-run-allを削除し、notiosを入れることでインストールと移行が完了します。

npm-run-allを利用していない場合は、まずnpm-run-allのドキュメントを確認していただき、npm-run-allから試していただくのが早いかと思います。

  • npm install -D notios
  • yarn add -D notios
  • pnpm add -D notios

npm-run-all は入れている場合は削除することを想定していますが、削除せずに n-run-s , n-run-p , n-npm-run-all というコマンドを代わりに利用することで併用もできます。

ただし、 notios 経由でなく、通常通りに実行すると、 notios で提供している run-s などは npm-run-all と同様の挙動を取ります。npm-run-all自体を直接呼んでいるので、この場合は全く同等の動きをします。

notiosのUIを開始する

セットアップが終われば、次は notios を起動します。

  • npx notios : スクリプトを起動後に選択します
  • npx notios <script名> : 指定したスクリプトを実行します
  • npx notios --help : ヘルプを表示します

yarn であれば yarn notios 、 pnpm であれば pnpm notios を利用してください。

UIの利用方法

UIには3つの基本のページがあります。

  • スクリプト選択
  • プロセスツリー
  • プロセスインスペクト

スクリプト選択

select-script

単に npx notios でnotiosを起動すると、スクリプト選択に移ります。ここでは、package.jsonに記述した npm-script がリストされます。上下キー、もしくはvim(1)やemacs(1)ライクなキーバインドも実はサポートされていますので、それらでカーソルを移動して選択し、エンターキーを押して実行を開始します。

プロセスツリー

inspect-proc

プロセスツリーでは、これまでに実行したスクリプトのプロセスを、ツリー形式で確認できます。

スクリプト選択モードで選択後に移動されます。もしくは、 npx notios dev のように、起動時にスクリプト名を指定することで直接プロセスツリーからスタートできます。

同様に上下キーで選択し、右キーで開く、左キーで閉じる、エンターキーでインスペクトへ移行できます。

また、nキーで新しくスクリプトを実行することや、条件を満たした対象にカーソルした状態で、xキーでプロセスの停止、rキーでリスタートをすることが可能です。

run-srun-p の分解は、これらのコマンドをnotios側から提供し、プロセス間通信をすることで実現しています。

<out><err>はそれぞれstdoutとstderrを表しています。

また、プロセスの色はそれぞれ以下のステートを意味しています。

状態
白(デフォルト) 実行中、もしくは子ノードに終了していないものを含む
灰色 待機中(run-sなど)
正常終了、もしくは子ノードがすべて正常終了
異常終了、もしくは子ノードがすべて終了し、異常終了を含む
子ノードのうちいずれかが異常終了

プロセスインスペクト

tree-proc

プロセスインスペクトでは、ターミナルログ(stdio)の内容を確認できます。親側を見るとマージされた状態で確認ができ、子側だとより個別での確認が可能です。

上下左右でスクロールが可能です。下部には、画面下側に何行のログがあるかを表示しています。

その他のキーバインドとしては、more(1)ライク、tmux(1)のviモードライク、もしくはemacs(1)ライクなものをそれぞれ用意しています。

また、vキーでラベルの表示を切り替えたり、tキーでタイムスタンプの表示を切り替えられます。

その他の注意点

  • npx notios からスタートしない場合は、インタラクティブではない通常の npm-run-all の挙動になります。たとえば npm run dev とした場合。
  • 現在、ログが増えてきた際のメモリ不足などの対処については考察中です。いまのところ使用してきて数日間利用しても落ちたりしたことはないですが、クリティカルなタスクには使用せず、いつ終了しても問題ないようなものを取り扱ってください。
  • いずれにせよプロダクション環境での使用は一切想定していませんので、dev dependency としてのみ利用してください。

最後に

notiosの基本的な利用方法は以上となります。notiosは発表に向けた基本的な実装は完了していますが、今後はもっと利用しながら、もしくはフィードバックもいただきながら改善を重ねていこうと思っております。

また、npm-run-allは内部で利用していますし、notiosが生まれるためになくてはならないものでした。あらためて、npm-run-allは素晴らしい製品だと思いますし、感謝しています。

もしフィードバックや質問等ありましたら、この記事のコメント欄やGitHubのIssue等で共有していただけれると助かります。

GitHubで編集を提案

Discussion