CLI-ColorモジュールでNode.jsのコンソール出力の色をカスタマイズ

2024-04-02

Node.jsのコンソール出力の色を変える方法

エスケープコードは、コンソールに特殊な指示を送るための文字列です。コンソール出力の色を変えるには、ANSIエスケープコードと呼ばれるものを使います。

例えば、以下のコードは、"Hello, world!"という文字列を青色で出力します。

console.log('\x1b[34mHello, world!\x1b[0m');

\x1b34m は、青色の文字を出力するエスケープコードです。

ANSIエスケープコードには、さまざまな色やスタイルを指定するためのコードがあります。詳細は、以下のサイトなどを参考にしてください。

chalkモジュールは、コンソール出力の色を簡単に設定するためのモジュールです。

chalkモジュールを使うには、まず以下のコマンドでインストールする必要があります。

npm install chalk

インストール後は、以下のコードのように使用できます。

const chalk = require('chalk');

console.log(chalk.blue('Hello, world!'));

Node.jsのコンソール出力の色を変える方法は、エスケープコードを使う方法とchalkモジュールを使う方法があります。

エスケープコードを使う方法は、コードが簡潔ですが、色やスタイルの設定が複雑です。chalkモジュールを使う方法は、コードが冗長になりますが、色やスタイルの設定が簡単です。

自分の目的に合った方法を選択してください。

エスケープコードを使う

// 文字色
console.log('\x1b[31m赤色\x1b[0m'); // 赤色
console.log('\x1b[32m緑色\x1b[0m'); // 緑色
console.log('\x1b[33m黄色\x1b[0m'); // 黄色
console.log('\x1b[34m青色\x1b[0m'); // 青色
console.log('\x1b[35mマゼンタ\x1b[0m'); // マゼンタ
console.log('\x1b[36mシアン\x1b[0m'); // シアン
console.log('\x1b[37m白色\x1b[0m'); // 白色

// 背景色
console.log('\x1b[41m赤色背景\x1b[0m'); // 赤色背景
console.log('\x1b[42m緑色背景\x1b[0m'); // 緑色背景
console.log('\x1b[43m黄色背景\x1b[0m'); // 黄色背景
console.log('\x1b[44m青色背景\x1b[0m'); // 青色背景
console.log('\x1b[45mマゼンタ背景\x1b[0m'); // マゼンタ背景
console.log('\x1b[46mシアン背景\x1b[0m'); // シアン背景
console.log('\x1b[47m白色背景\x1b[0m'); // 白色

// 文字色と背景色
console.log('\x1b[31m\x1b[47m赤色文字・白色背景\x1b[0m'); // 赤色文字・白色背景
console.log('\x1b[32m\x1b[47m緑色文字・白色背景\x1b[0m'); // 緑色文字・白色背景
console.log('\x1b[33m\x1b[47m黄色文字・白色背景\x1b[0m'); // 黄色文字・白色背景
console.log('\x1b[34m\x1b[47m青色文字・白色背景\x1b[0m'); // 青色文字・白色背景
console.log('\x1b[35m\x1b[47mマゼンタ文字・白色背景\x1b[0m'); // マゼンタ文字・白色背景
console.log('\x1b[36m\x1b[47mシアン文字・白色背景\x1b[0m'); // シアン文字・白色背景
console.log('\x1b[37m\x1b[47m白色文字・白色背景\x1b[0m'); // 白色文字・白色背景

// その他
console.log('\x1b[1m太字\x1b[0m'); // 太字
console.log('\x1b[2m斜体\x1b[0m'); // 斜体
console.log('\x1b[5m点滅\x1b[0m'); // 点滅
console.log('\x1b[7m反転\x1b[0m'); // 反転

chalkモジュールを使う

const chalk = require('chalk');

// 文字色
console.log(chalk.red('赤色'));
console.log(chalk.green('緑色'));
console.log(chalk.yellow('黄色'));
console.log(chalk.blue('青色'));
console.log(chalk.magenta('マゼンタ'));
console.log(chalk.cyan('シアン'));
console.log(chalk.white('白色'));

// 背景色
console.log(chalk.bgRed('赤色背景'));
console.log(chalk.bgGreen('緑色背景'));
console.log(chalk.bgYellow('黄色背景'));
console.log(

エスケープコードとchalkモジュール以外の方法

npm install colors

const colors = require('colors');

console.log(colors.red('赤色'));
console.log(colors.green('緑色'));
console.log(colors.yellow('黄色'));
console.log(colors.blue('青色'));
console.log(colors.magenta('マゼンタ'));
console.log(colors.cyan('シアン'));
console.log(colors.white('白色'));

npm install cli-color

const clc = require('cli-color');

console.log(clc.red('赤色'));
console.log(clc.green('緑色'));
console.log(clc.yellow('黄色'));
console.log(clc.blue('青色'));
console.log(clc.magenta('マゼンタ'));
console.log(clc.cyan('シアン'));
console.log(clc.white('白色'));