ホームページ  >  記事  >  ウェブフロントエンド  >  数キロバイトの JavaScript によるコンソールのスタイル設定

数キロバイトの JavaScript によるコンソールのスタイル設定

王林
王林オリジナル
2024-07-18 18:34:31777ブラウズ

Console Styling in JavaScript with a few kilobytes

あなたのことは知りませんが、私は JavaScript プロジェクトのコンソール ログを見栄えよく保つのが好きです。また、すべての端末が絵文字をサポートしているわけではないので、コンソール出力に色を付ける以外に良い方法はないでしょうか?

そうですね、必要なコンソール スタイルごとに ANSI エスケープ コードをグーグルで検索することで解決できます。あるいは、W3Docs などのページからいくつかを覚えておくこともできます。しかし、私はログを見栄え良くするのが大好きです。決してたくさんのことを覚えられる人間ではありません。どこでも機能する 1 つの方法を好むのです。

そうですね、私は通常、JS の色付きログのみを使用するので、文字通りどこでも機能するものは必要ありません。ただし、少なくとも JavaScript が関係する場所であればどこでも機能します。

そこで私は、必要になる可能性のあるすべての ANSI エスケープ コードを関数の形式で含む独自のスクリプトを作成することにしました。しかし、すべてのプロジェクトで同じスクリプトを何度もコピーするのは煩わしいことに気づきました。そこで、npm i と init 以外に npm コマンドを使用したことがない私は、さらに詳しく学び、自分のプロジェクトにインストールできる (または、NodeJS 以外のプロジェクトの場合は GitHub リポジトリのクローンを作成できる) プライベート NPM パッケージを作成することにしました。
パッケージをインストールするたびに NPM 認証を処理したくなかったので、パッケージを公開しました。

そして、それが今日の目的です。javascript-console-styling は、このプロセスを容易にするために私が作成したパッケージです。

確かに、私と似たようなパッケージは以前にも作られたことがあります (これは私が作った後に初めて気づいた事実です)。しかし、私自身の解決策の方が私や私のような人にとってはまだ良いことに気づきました:

  • npm によると、私のパッケージは 14KB のスペースしか必要としませんでした。一方、他の同様のパッケージは同じ量 (500 キロバイト以上) の 50 倍 を必要としました。どちらも 1 メガバイト未満ではありますが、すべてのファイルを簡単に管理できる (または、必要に応じてフォークして簡単に変更することもできる) ため、パッケージは小さい方が良いです

  • 私のパッケージは関数であるため、異なるスタイルと装飾をネストできます...そして、異なるスタイルの部分文字列を含むスタイル付き文字列全体がある場合でも、部分文字列を連結するだけで済みます(内部の部分文字列を含む)各スタイル関数がリセットするため、親文字列はその後のスタイルの適用を停止します)

  • 私のパッケージには、ユーザーが端末で出力を確認できるように、考えられるすべての色と装飾の組み合わせを示す簡単なテスト ツールがありました (テスト機能はデフォルトのパッケージには含まれていませんが、NPM ページとGitHub)

全体として、私は独自のコードを使用することを好みます。しかし、公開パッケージを所有することの一部は、それがどのように役立つかを人々に知らせ、必要な場合に自分で選択できるようにすることです。

これが私が作成する最後の NPM パッケージになるとは思いませんが、NPM 全体についてやる気を引き出す良い方法でした!

必ずパッケージをチェックして、ハッキングを楽しんでください!

以上が数キロバイトの JavaScript によるコンソールのスタイル設定の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。