【保存版】Node.jsでコンソールログを操作：readline、chalk、figlet、blessモジュールの比較と使い分け

2024-06-01

Node.jsでコンソールログの同じ行を更新する方法

以下の2つの方法で、Node.jsでコンソールログの同じ行を更新することができます。

readlineモジュールは、コンソール入出力の制御機能を提供します。このモジュールを使用して、カーソル位置を制御し、同じ行に書き込むことができます。

const readline = require('readline').createInterface({
  input: process.stdin,
  output: process.stdout
});

let progress = 0;

setInterval(() => {
  readline.cursorTo(0, 0); // カーソルを左上に移動
  readline.clearLine(1); // 現在の行を消去
  readline.write(`Progress: ${progress}%`); // 更新されたメッセージを書き込む
  progress++;
}, 100);

この例では、readlineモジュールの cursorTo メソッドを使用してカーソルを左上に移動し、clearLine メソッドを使用して現在の行を消去しています。その後、write メソッドを使用して更新されたメッセージを書き込みます。

非同期書き込みを使用する

console.log は非同期で動作するため、同じ行に書き込むために2つのログステートメントを連続して出力することができます。1つ目のステートメントで部分的なメッセージを出力し、タイマーを使用して非同期的に2つ目のステートメントを出力することで、同じ行が更新されるように見えます。

let progress = 0;

setInterval(() => {
  console.log(`Progress: ${progress}%`);
  setTimeout(() => {
    console.log('\rProgress: ' + (progress + 1) + '%'); // 前のログを上書き
    progress++;
  }, 100);
}, 100);

この例では、console.log ステートメントを2つ使用しています。1つ目は部分的なメッセージを出力し、2つ目はタイマーを使用して非同期的に出力されます。2つ目のステートメントには \r 文字が含まれており、これはカーソルを行頭に移動する効果があります。これにより、2つ目のステートメントが1つ目のステートメントを上書きし、同じ行が更新されるように見えます。

注意事項

上記の方法は、すべてのターミナル環境で動作するとは限りません。一部のターミナルでは、正しく動作しない場合があります。
同じ行を更新する代わりに、新しい行を追加してスクロールさせる方が、読みやすい場合もあります。

これらの方法を使用して、Node.jsプログラムでコンソールログの同じ行を更新することができます。状況に応じて適切な方法を選択してください。

Node.jsでコンソールログの同じ行を更新するサンプルコード

const readline = require('readline').createInterface({
  input: process.stdin,
  output: process.stdout
});

const total = 100; // 完了までの合計ステップ数
let progress = 0; // 現在の進捗状況

setInterval(() => {
  readline.cursorTo(0, 0); // カーソルを左上に移動
  readline.clearLine(1); // 現在の行を消去
  const bar = `[${'='.repeat(Math.floor(progress / total * 10))}${'-'
    .repeat(10 - Math.floor(progress / total * 10))}] ${progress}/${total}%`;
  readline.write(bar); // 更新されたメッセージを書き込む
  progress++;

  if (progress === total) {
    readline.write('\n'); // 完了時に改行
    clearInterval(interval);
  }
}, 100);

このコードを実行すると、以下のような出力がコンソールに表示されます。

[=========         ] 50/100%
[============      ] 75/100%
[==============   ] 100/100%

このコードは、以下の点に改良できます。

アニメーションの速度を調整したい場合は、setInterval のタイマー間隔を変更します。
バーのスタイルを変更したい場合は、= と - の文字を置き換えます。
完了時にメッセージを表示したい場合は、if ステートメント内にメッセージを追加します。

このサンプルコードを参考に、さまざまなコンソールログ更新機能を作成することができます。

Node.jsでコンソールログの同じ行を更新するその他の方法

chalkモジュールは、コンソールログの書式設定に役立つライブラリです。このモジュールを使用して、テキストの色、スタイル、エフェクトを設定することができます。また、同じ行に書き込むための機能も提供しています。

const chalk = require('chalk');

let progress = 0;

setInterval(() => {
  const bar = chalk.green(`[${'='.repeat(Math.floor(progress / total * 10))}${'-'
    .repeat(10 - Math.floor(progress / total * 10))}] ${progress}/${total}%`);
  console.log(bar.replace(/\r/g, '')); // カーソル位置を維持
  progress++;

  if (progress === total) {
    console.log('\n'); // 完了時に改行
    clearInterval(interval);
  }
}, 100);

この例では、chalkモジュールを使用してバーを緑色に設定しています。また、replace メソッドを使用してカーソル位置を維持するようにしています。

figletモジュールは、ASCIIアートを作成するためのライブラリです。このモジュールを使用して、同じ行に更新されるASCIIアートアニメーションを作成することができます。

const figlet = require('figlet');

let progress = 0;

setInterval(() => {
  figlet.text(`Progress: ${progress}%`, {
    font: 'banner',
    horizontalLayout: true,
    renderer: 'unicode'
  }, (err, data) => {
    if (err) {
      console.error(err);
      return;
    }
    console.log(data.replace(/\r/g, '')); // カーソル位置を維持
    progress++;

    if (progress === total) {
      console.log('\n'); // 完了時に改行
      clearInterval(interval);
    }
  });
}, 100);

blessモジュールは、ターミナル制御機能を提供するライブラリです。このモジュールを使用して、カーソル位置の制御、テキストの強調表示、画面の消去などを行うことができます。

const bless = require('bless');

const terminal = bless();

let progress = 0;

setInterval(() => {
  terminal.cursorTo(0, 0); // カーソルを左上に移動
  terminal.eraseLine(1); // 現在の行を消去
  const bar = `[${'='.repeat(Math.floor(progress / total * 10))}${'-'
    .repeat(10 - Math.floor(progress / total * 10))}] ${progress}/${total}%`;
  terminal.write(bar); // 更新されたメッセージを書き込む
  progress++;

  if (progress === total) {
    terminal.write('\n'); // 完了時に改行
    clearInterval(interval);
  }
}, 100);