設定

オプションを開く

任意の開発ツールを開いて以下の操作を行うと、開発ツールのオプションペインが開きます:

  • ツールボックスのツールバー上にある "オプション" ボタン () をクリックする:
  • または、F1 (Firefox 43 の新機能) を押下すると、アクティブなツールと設定ページを切り替えできます
  • または、Ctrl/Cmd+Shift+O を押下すると、アクティブなツールと設定ページを切り替えできます

オプションペインは、以下のようなものです:

Depicts the Toolbox options

カテゴリ

標準の Firefox 開発ツール

このチェックボックスのグループでは、ツールボックスで有効にするツールを決定します。新しいツールは、Firefox に搭載されていてもデフォルトで無効になっていることがあります。

利用可能なツールボックスのボタン

このチェックボックスのグループでは、どのツールをツールボックスのツールバーアイコンとして表示するかを決定します。

開発ツールのテーマを選択

ここでは、3 種類のテーマを切り替えることができます。

以下は Light テーマであり、デフォルトのテーマです:

Light theme for DevTools

Dark テーマ (Firefox Developer Edition のデフォルトのテーマです):

Dark theme for DevTools

Firefox 48 の新機能

Firebug 拡張機能に似ている Firebug テーマもあり、Firebug に慣れているのでしたら "親しみ" を感じるでしょう:

Firebug theme for DevTools

共通設定

複数のツールに適用する設定です。ひとつだけあります:

ログ出力を残す
Web コンソールおよびネットワークモニタで、別のページへ移動するときに出力内容を消去するかを設定します。

調査

ブラウザ CSS を表示
ブラウザが適用するスタイル (ユーザエージェントスタイル) をインスペクタのルールビューに表示するかを設定します。この設定はインスペクタの計算済みビューにある "ブラウザ CSS" チェックボックスとは無関係であることに注意してください。
DOM 属性値を省略 (Firefox 47 の新機能)
デフォルトでは、インスペクタは 120 文字を超える DOM 属性を切り詰めて表示します。チェックボックスのチェックを外すと、この動作を行いません。この設定は、about:config の "devtools.markup.collapseAttributes" を切り替えます。属性を切り詰める文字数のしきい値を変更するには、about:config で "devtools.markup.collapseAttributeLength" を編集してください。
既定の色単位
調査時に色をどのように表現するかの設定です:
  • 16 進数
  • HSL(A)
  • RGB(A)
  • 色の名前
  • 記述通りの単位 (Firefox 44 の新機能)

Web コンソール

タイムスタンプを表示
Web コンソールでタイムスタンプを表示するかの設定です。デフォルトで Web コンソールはタイムスタンプを表示しません。

スタイルエディタ

元のソースを表示
この設定を有効にすると、ソースマップをサポートする CSS プリプロセッサを使用している場合に、スタイルエディタが生成された CSS ではなく元のプリプロセッサのソースを表示できます。スタイルエディタの CSS ソースマップのサポートについて確認してください。この設定を有効にすると、ページインスペクタのルールビューでも元のソースへリンクするようになります
CSS 自動補完
スタイルエディタで候補の自動補完が可能になります。

JavaScript プロファイラ

Gecko プラットフォームのデータを表示
プロファイルに Gecko プラットフォームのシンボルを含めるかを設定します。

エディタ設定

これは CodeMirror ソースエディタの設定です。このエディタは Firefox に内蔵されており、スクラッチパッドスタイルエディタなど、いくつかの開発ツールで使用しています。

インデントを検知
カーソルがある行のインデント状態に基づいて、新しい行を自動的にインデントします。
閉じ括弧自動入力
 
インデントにスペース文字を使う
 
タブの長さ
 
キー割り当て
既定の CodeMirror のキー割り当て、またはいくつかの著名なエディタのキー割り当てから選択します:
  • Vim
  • Emacs
  • Sublime Text

詳細な設定

HTTP キャッシュを無効化
ツールボックスを開いているすべてのタブで、最初に読み込む場合のパフォーマンスをシミュレーションするため、ブラウザの HTTP キャッシュを無効にします。この設定は持続的ですので、設定を行った後にツールボックスを開き直しても、キャッシュは無効化されたままになります。開発ツールを閉じた状態では、キャッシュが有効になります。なお、Service Workers はこの設定の影響を受けません。
バージョン 49 より前の Firefox ではこのオプションの名称が "キャッシュを無効" でしたが、HTTP キャッシュに影響があって Service WorkersCache API には影響がないことを明確にするため改名しました。
JavaScript を無効
JavaScript が無効な状態でタブをリロードします。
HTTP による Service Workers を有効
安全ではない Web サイトから Service Worker を登録可能にします
ブラウザとアドオンのデバッガを有効
Web コンテンツだけではなく、ブラウザ自体のコンテキストで開発ツールを使用できます。
リモートデバッガを有効
開発ツールでリモートの Firefox インスタンスのデバッグを可能にします。

ドキュメントのタグと貢献者

 このページの貢献者: yyss
 最終更新者: yyss,