ユーザーインターフェースの概要

エディター

フォーカス: Escape

エディターを使用して、ソースコードの読み取り、書き込み、探索を行います。

アクションインジケーターとアクションリスト

アクションリストを開く: Alt+Enter

ガターに表示されるさまざまなアイコン（ など）は、迅速な修正やその他のアクションに気づくのに役立ちます。そのようなアクションインジケーターをクリックするか Alt+Enter を押すと、現在のキャレット位置で利用できるすべてのクイックフィックスとその他のアクションがリストされたアクションリストが開きます。

ナビゲーションバー

フォーカス: Alt+Home

表示 / 非表示: 表示 | 外観 | ナビゲーションバー

上部のナビゲーションバーは、プロジェクトツールウィンドウの簡単な代替手段であり、プロジェクトの構造を確認したり、特定のファイルを開いたり、現在のファイルの特定のコード要素にジャンプしたりできます。

ナビゲーションバーの右側にあるボタンを使用して、 を実行し、アプリケーションを で デバッグし、基本的なバージョン管理操作を実行します（バージョン管理統合が構成されている場合）。また、なんでも実行 （ Ctrl を 2 回押す）およびどこでも検索 （ Shift を 2 回押す）へのボタンも含まれています。

ステータスバー

表示 / 非表示: 表示 | 外観 | ステータスバー

メインウィンドウの下部にあるステータスバーの左側には、最新のイベントメッセージと、マウスポインターでマウスをポイントしたときのアクションの説明が表示されます。ステータスバーのメッセージをクリックして、イベントログで開きます。ステータスバーのメッセージを右クリックし、コピーを選択して、問題の解決策を検索するとき、またはサポートチケットまたは WebStorm の課題追跡に追加する必要があるときにメッセージテキストを貼り付けます。

クイックアクセスボタン または を使用して、ツールウィンドウを切り替え、ツールウィンドウバーを非表示にします。

ステータスバーには、バックグラウンドタスクの進行状況も表示されます。 をクリックしてバックグラウンドタスクマネージャーを表示できます。

ステータスバーの右側には、プロジェクト全体と IDE のステータスを示し、さまざまな設定へのアクセスを提供するウィジェットが含まれています。プラグインのセットと構成設定に応じて、ウィジェットのセットは変更できます。ステータスバーを右クリックして、表示または非表示にするウィジェットを選択します。

ウィジェット	説明
52:11	エディター内の現在のキャレット位置の行番号と列番号を表示します。数字をクリックして、キャレットを特定の行と列に移動します。エディターでコードフラグメントを選択すると、WebStorm には、選択したフラグメントの文字数と改行も表示されます。
	現在のファイルの改行に使用される行末を表示します。このウィジェットをクリックして、行区切り記号を変更します。
	現在のファイルを表示するために使用されるエンコーディングを表示します。別のエンコーディングを使用するには、ウィジェットをクリックします。
	ファイルを編集しないようにロックする（読み取り専用に設定する）か、ファイルを編集する場合はロックを解除します。
JSON スキーマ	ウィジェットは、アクティブなエディタータブで JSON ファイル（たとえば、package.json または tsconfig.json）を開くと、ステータスバーに表示されます。ウィジェットには、この JSON ファイルで使用されているスキーマが表示されます。JSON から詳細を参照してください。
TypeScript	エディターで TypeScript ファイルを開いた後は、ウィジェットが常にステータスバーに表示されます。ウィジェットを使用して TypeScript をコンパイルし、TypeScript 言語サービスを構成または再起動します。TypeScript および TypeScript を JavaScript にコンパイルするから詳細を参照してください。
	バージョン管理統合が有効な場合、このウィジェットは現在の VCS ブランチを表示します。それをクリックして VCS ブランチを管理します。
	現在のファイルで使用されているインデントスタイルを表示します。クリックして、現在のファイルタイプのタブとインデント設定を構成するか、現在のプロジェクトでインデント検出を無効にします。
	ヒープメモリの総量のうち、WebStorm が消費するメモリの量を示します。詳細については、メモリヒープを増やすを参照してください。

ツールウィンドウ

表示 / 非表示: 表示 | ツールウィンドウ

ツールウィンドウは、編集コードを補足する機能を提供します。例: プロジェクトツールウィンドウにはプロジェクトの構造が表示され、実行ツールウィンドウには実行時にアプリケーションの出力が表示されます。

デフォルトでは、ツールウィンドウはメインウィンドウの側面と底面にドッキングされています。必要に応じて配置、ドッキング解除、サイズ変更、非表示などを行うことができます。ツールウィンドウのタイトルを右クリックするか、タイトルの をクリックして配置オプションを表示します。

ショートカットを割り当てて、頻繁に使用するツールウィンドウにすばやくアクセスできます。それらのいくつかはデフォルトでショートカットを持っています。例: プロジェクトツールウィンドウを開くには Alt+1 を押し、ターミナルツールウィンドウを開くには Alt+F12 を押します。エディターから最後のアクティブなツールウィンドウにジャンプするには、F12 を押します。

コンテキストメニュー

インターフェースのさまざまな要素を右クリックして、現在のコンテキストで使用可能なアクションを確認できます。例: プロジェクトツールウィンドウでファイルを右クリックすると、そのファイルに関連するアクションが表示されます。または、エディターで右クリックすると、現在のコードフラグメントに適用されるアクションが表示されます。

これらの操作のほとんどは、画面上部のメインメニューまたはメインウィンドウからも実行できます。ショートカット付きのアクションには、アクション名の横にショートカットが表示されます。

ポップアップメニュー

ポップアップメニューを使用すると、現在のコンテキストに関連するアクションにすばやくアクセスできます。以下は、いくつかの便利なポップアップメニューとそのショートカットです。

• Alt+Insert は、コンテキストに基づいてボイラープレートコードを生成するための生成ポップアップを開きます。

• Ctrl+Alt+Shift+T は、コンテキストで利用可能なリファクタリングのリストを含むリファクタリングポップアップを開きます。

• プロジェクトツールウィンドウの Alt+Insert は、プロジェクトに新しいファイルとディレクトリを追加するための新規ポップアップを開きます。

• Alt+` は、バージョン管理システムで継続的に使用可能なアクションを含む VCS 操作ポップアップを開きます。

頻繁に使用するアクションのクイックリストを使用して、カスタムポップアップメニューを作成できます。

メインウィンドウ

メインウィンドウには、単一の WebStorm プロジェクトのすべての情報が含まれています。複数のウィンドウで複数のプロジェクトを開くことができます。デフォルトでは、ウィンドウヘッダーにはプロジェクトの名前と現在開いているファイルの名前が含まれています。複数のモジュールがある場合は、関連するモジュールの名前も表示されます。