DevTools Authorを使用してChromeデベロッパーツールをカスタマイズする

フロントエンドの開発者であれば、Google ChromeのDevToolsパネルについてすでに知っているはずです。これは、生のHTML / CSSをJSコンソールとリアルタイムでDOMを操作する機能と共に編集するためのツールを提供するすべてのバージョンのChromeにバンドルされています.

DevTools Authorと呼ばれる新しい無料Chromeプラグインを使用すると、追加の構文配色、固有のフォント、およびカスタムフォントサイズを使用してDevToolsパネルをカスタマイズできます。.

設定はとても簡単です。 Chromeウェブストアから拡張機能をインストールしてから、ブラウザのこのリンクにアクセスしてください。 chrome：// flags /＃enable-devtools-experiment

DevToolsの実験を有効にする必要があるChrome Flagsパネルがあります。有効になったらChromeを再起動し、DevTools設定パネルを開いて[実験]タブを見つけます。.

それから、「カスタムUIテーマを許可する」にチェックを入れるだけでいいです。!

Chromeのエディタをはるかに使いやすくするために、25種類以上の構文の配色を選択できます。そして、フォントサイズを10ピクセルから22ピクセルに変更したり、コンソールフォントをオペレーティングシステムにインストールされているフォントに更新することもできます。.

このプラグインは、DevToolsにコア機能を追加するのではなく、DevToolsウィンドウのスタイルと外観を変更することを可能にします。驚くほど簡単に設定でき、DevToolsエクスペリエンスをよりパーソナライズされたものにすることができます。.

セットアップ中に問題が発生した場合は、このガイド付きイントロビデオをご覧ください。.