JavaScriptでconsole.logの色を変更する方法


console.logの色を変更する方法はいくつかあります。以下にいくつかの方法とそれに関連するコード例を示します。

  1. テキストスタイルをCSSで変更する方法: JavaScriptのconsole.log出力はCSSによってスタイリングできます。CSSの「%c」フォーマット指定子を使い、スタイルを適用するテキストの前に指定します。

    console.log('%cThis is a styled log message', 'color: blue; font-weight: bold;');

    上記の例では、テキストの色を青に、フォントの太さを太字に設定しています。

  2. ANSIエスケープシーケンスを使用する方法: ANSIエスケープシーケンスを使えば、より高度なカスタマイズが可能です。ただし、これは一部のターミナルエミュレータやブラウザではサポートされていない場合もあります。

    console.log('\x1b[34m%s\x1b[0m', 'This is a styled log message');

    上記の例では、テキストの色を青に設定しています。

  3. ライブラリやフレームワークを使用する方法: サードパーティのライブラリやフレームワークを使用することで、console.logのスタイリングをより簡単に行うことができます。例えば、chalkというライブラリを使用すると、様々なスタイルオプションを指定できます。

    const chalk = require('chalk');
    console.log(chalk.blue.bold('This is a styled log message'));

    上記の例では、chalkライブラリを使用してテキストの色を青に、フォントの太さを太字に設定しています。

これらは一部の方法ですが、JavaScriptでconsole.logの色を変更するためのさまざまなアプローチがあります。状況や好みに応じて、適切な方法を選んでください。