Visual Studio Code(VS Code)を使っていると、「あれ?エクスプローラーが消えた!」と焦ることはありませんか。
ファイルやフォルダを管理するために欠かせないエクスプローラーですが、誤操作や設定変更によって非表示になっていることがあります。
この記事では、Visual Studio Codeでエクスプローラーを表示する方法、表示されないときの原因と対処法、さらに便利な表示カスタマイズの方法まで、初心者にもわかりやすく解説します。
Visual Studio Code(以下、VS Code)のエクスプローラーとは、左側のサイドバーに表示されるファイル・フォルダの一覧画面のことです。
このエクスプローラーでは、以下のような操作が可能です。
つまり、エクスプローラーはVS Codeで作業する上での“ナビゲーションの中心”です。
これが表示されていないと、どのファイルを編集しているのか分からず非常に不便になります。
VS Codeでエクスプローラーを表示する最も簡単な方法は、ショートカットキーまたはメニュー操作です。
最も素早い方法は、以下のショートカットを使うことです。
Ctrl + Shift + ECommand + Shift + Eこのキーを押すたびに、エクスプローラーが「表示 ↔ 非表示」と切り替わります。
もし誤って押して非表示になっていた場合も、同じショートカットで簡単に元に戻せます。
ショートカットに慣れていない方は、メニューから表示することもできます。
これで、左側のサイドバーにエクスプローラーが表示されます。
VS Codeの左端には「サイドバーアイコン」が並んでいます。
その中にある「ファイルのアイコン(四角いページのようなマーク)」をクリックすると、エクスプローラーが開きます。
逆に、他の機能(検索、Git、拡張機能など)を選択していると、エクスプローラーが一時的に隠れているように見えることがあります。
この場合は、ファイルアイコンをクリックすればすぐに戻ります。
エクスプローラーが見えない場合、単に「隠れている」だけでなく、設定やウィンドウのレイアウトに問題があることもあります。
ここでは代表的な原因と対処法を紹介します。
VS Codeでは、サイドバーを完全に非表示にできる機能があります。
この場合、エクスプローラーは存在しているのに画面に出ていません。
対処法:サイドバーの表示切り替え
Ctrl + BCommand + Bこのショートカットを押すと、サイドバー全体の表示が切り替わります。
もしサイドバーごと見えなくなっていた場合は、これで解決できます。
エクスプローラーは、開いているフォルダやワークスペースをもとに表示されます。
そのため、何も開いていない状態だと「空っぽの画面」になり、エクスプローラーが表示されないように見えます。
対処法:フォルダを開く
これでエクスプローラーにファイル一覧が表示されるようになります。
ウィンドウサイズを変更したり、複数の画面を表示していると、エクスプローラーの領域が極端に狭くなって見えないことがあります。
対処法:ウィンドウレイアウトのリセット
これで、エクスプローラーの表示領域が元に戻る場合があります。
特定の拡張機能がUIの表示をカスタマイズしている場合、エクスプローラーが意図せず隠れることもあります。
対処法:一時的に拡張機能を無効化
これで改善する場合は、その拡張機能が原因です。
VS Codeの魅力は、エクスプローラーの表示や動作を自由にカスタマイズできることです。
ここでは便利な設定をいくつか紹介します。
エクスプローラーでファイルをクリックしたとき、既定では「プレビュー表示」になります。
別タブで開きたい場合は、以下の設定を変更します。
これで、ファイルをクリックするたびに新しいタブで開くようになります。
フォルダをクリックすると中身を展開する「自動展開機能」も便利です。
設定で有効化するには:
これで、編集中のファイルを自動的にエクスプローラーでハイライトしてくれます。
デフォルトでは左側にあるサイドバーを、右側に移動することも可能です。
Ctrl + Shift + P → 「サイドバーを右に移動」で検索左右の好みに合わせて作業効率を上げましょう。
VS Codeでは、ファイルの種類ごとに異なるアイコンを表示できます。
特に多言語プロジェクトを扱う場合は、アイコンテーマを導入すると分かりやすくなります。
おすすめ拡張機能:
これらを導入すると、HTML、CSS、Pythonなどのファイルが一目で識別できるようになります。
Visual Studio Codeのエクスプローラーは、ファイル操作やプロジェクト管理に欠かせない機能です。
もし非表示になっていても、以下の手順で簡単に戻せます。
Ctrl + Shift + E で表示を切り替えCtrl + Bまた、表示位置やアイコンテーマをカスタマイズすることで、より快適に開発を進めることができます。