Oraを用いたローディング・スピナーの途中でconsole.logを綺麗に出力する #JavaScript

CLIツールを作っていてoraでスピナーを出しながらconsole.logでログも出力したい

例えば以下のようなケース

import ora from "ora";

const spinner = ora("loading...").start();

console.log("this is logging in the middle");

spinner.succeed();

上記を実行すると以下のようになってしまう。

途中で出力したログのせいでspinnerがおかしなことになっている。

これを回避するには console.log の前後でspinnerを停止し、再レンダーしないといけない

const spinner = ora("loading...").start();

+ spinner.clear();
console.log("this is logging in the middle");
+ spinner.render();

spinner.succeed();

これで綺麗にでる

とはいえ、これでもダメではないが、複数スピナーが同時に出ている状態でconsole.logを呼び出すなどは、かなり難儀することになる。

なので個人的にはスピナーとロガーを同一の責務にカプセル化した実装を用意することをオススメしたい。詳しくは以下の記事を参照。