VS CodeでAzure「リソース」ビューが表示されない原因と対処法まとめ【拡張機能・サインイン・ネットワーク】

Visual Studio Code で Azure 拡張機能にサインインしたのに、左側の「リソース(Resources)」ビューがどこにも見当たらない――この症状は、拡張機能やアカウント、ビューの表示設定など複数の原因が絡みやすく、意外とハマりがちです。本記事では公式 Q&A では触れられていない「実際に効く確認ポイント」を、チェックリスト形式で詳しく解説します。

目次

VS Code の Azure「リソース」ビューとは何か

まずは、問題の「リソース(Resources)」ビューが何を指しているのかを整理します。

  • Visual Studio Code の左側「アクティビティバー」に表示される「Azure」アイコンをクリックすると表示されるビューの一部
  • Azure サブスクリプション内のリソース(App Service、Storage Account、Functions など)をツリー形式で表示する機能
  • 主に以下の拡張機能によって提供される
    • Azure Tools(複数拡張のパック)
    • Azure Account(サインイン/アカウント管理)
    • Azure Resources系の拡張(リソースツリーを表示)

つまり、「VS Code に Azure のリソース一覧を表示する UI 全体」を構成しているのがこれらの拡張であり、どれか一つでも無効化されていたり、ネットワークやワークスペースの制限を受けていたりすると、Azure アイコンそのものが出ない・リソースツリーが空のまま・Resources という見出し自体が表示されないといった症状につながります。

よくある原因と対処の全体像

先に、よくある原因と確認すべき場所を表で一覧しておきます。後続の章ではそれぞれ詳しく解説します。

症状・原因候補確認する場所主な対処
Azure アイコンがアクティビティバーに表示されない拡張機能ビュー、アクティビティバーの「表示をカスタマイズ」Azure Tools / Azure Account をインストール・有効化、ビューの表示設定をリセット
サインインしているのにリソースが空のままコマンドパレット、Azure ビューAzure: Sign In のやり直し、Azure: Select Subscriptions で対象サブスクリプションを選択
リソースビューが突然消えた/レイアウトがおかしいウィンドウレイアウト、コマンドパレットView: Reset View Locations でビュー配置を初期化、Developer: Reload Window
企業ネットワークでだけリソースが見えないVS Code 設定(http.proxy)、OS/ブラウザのプロキシ設定プロキシ設定の見直し、Azure: Sign Out → 再サインイン
WSL / SSH / コンテナ接続時だけ表示されない拡張機能ビュー(インストール先)、左下のリモート接続表示Azure 関連拡張をリモート側にもインストールし、リロード
制限付きモードで拡張が制限されているウィンドウ上部のバナー、ステータスバーこのワークスペースを信頼する を選択し、再読み込み

拡張機能がインストール・有効化されているか確認する

最初にチェックすべきは、Azure 関連拡張機能が正しくインストールされており、無効化されていないかどうかです。Visual Studio(フル IDE)側を最新化していても、VS Code の拡張には一切影響しません。VS Code 側を必ず確認しましょう。

Azure Tools 拡張パックの状態を確認

  1. Ctrl+Shift+X(Mac は Cmd+Shift+X)で拡張機能ビューを開きます。
  2. 検索ボックスに Azure Tools と入力します。
  3. 「Azure Tools(by Microsoft)」が表示されているか確認します。
    • 「インストール」ボタンが出ていれば、まずインストール。
    • 「有効にする」と表示されていれば、既に入っているものの無効化されている状態なので、有効にするをクリック。
  4. インストールや有効化を行った場合は、VS Code の右下に表示される通知から「再読み込み」をクリックするか、後述の Developer: Reload Window を実行してウィンドウを再読み込みします。

Azure Account / Azure Resources 系拡張も確認

Azure Tools は「拡張パック」であり、実体となる複数の拡張をまとめて提供しています。特に次の拡張が無効化されていないか確認します。

  • Azure Account
  • Azure Resources / Azure Resource Groups など、リソースツリーを提供する拡張

拡張機能一覧で、これらが「無効」と表示されている場合は 有効にする をクリックし、ウィンドウを再読み込みします。
組織ポリシーや個人設定で誤って一括無効化しているケースもあるため、「インストール済み」タブを上からざっと見直しておくと安心です。

Azure へのサインインとサブスクリプション選択をやり直す

拡張機能が有効でも、Azure アカウントやサブスクリプションの状態によってはリソースツリーが空のままになります。以下の順で確認するとスムーズです。

Azure: Sign In でサインインし直す

  1. Ctrl+Shift+P(Mac は Cmd+Shift+P)でコマンドパレットを開きます。
  2. Azure: Sign In と入力し、表示されたコマンドを選択します。
  3. ブラウザが開くので、使用したい Azure アカウントでサインインします。
    • 複数アカウント(個人アカウントと会社アカウントなど)を持っている場合は、「どのアカウントで VS Code にサインインしたか」を意識して選び直すとトラブルを減らせます。

一度サインインしている状態でも、環境を切り替えた直後や資格情報の有効期限切れなどで内部的に認証エラーが起きている場合があります。その場合も Azure: Sign In の実行で復旧することが多いです。

Azure: Select Subscriptions で対象を選ぶ

サインイン直後の状態では、「どのサブスクリプションを VS Code に表示するか」が未選択のままのことがあります。その場合、サインイン自体は成功していても、リソースツリーが空のままです。

  1. 再度コマンドパレットを開き、Azure: Select Subscriptions を実行します。
  2. 利用可能なサブスクリプションの一覧がダイアログで表示されます。
  3. VS Code で操作したいサブスクリプションにチェックを入れます。
    • 複数テナント/複数サブスクリプションを持つアカウントの場合、意図しないサブスクリプションだけが選択されていることもあるので、一覧を一度「全て解除 → 必要なものだけ選択」とするのがおすすめです。

選択後、Azure ビューに戻って 更新(Refresh) アイコンをクリックし、リソースツリーが更新されるか確認します。

ビューが隠れていないか・レイアウトが崩れていないか

拡張機能とサインインに問題がなくても、単にビューが非表示になっているだけ、レイアウトが崩れて別の場所に移動してしまっただけ、というケースもよくあります。

アクティビティバーに Azure アイコンが表示されているか

  1. メニューから [表示] → [外観] → [アクティビティバーを表示] をクリックし、チェックが付いているか確認します。
  2. アクティビティバーの一番下にある …(その他) アイコンをクリックし、「表示をカスタマイズ」 を選択します。
  3. 表示された一覧から Azure にチェックが入っているか確認し、外れていればチェックを入れます。

ここで Azure が表示されない場合は、拡張機能が無効化されているか、インストールされていない可能性が高いため、前章の拡張機能チェックに戻ります。

View: Reset View Locations でビュー配置を初期化

VS Code はウィンドウ内のビューをドラッグ&ドロップで自由に移動できるため、気付かないうちに Azure ビューが別のサイドバーやパネルに移動してしまうことがあります。こうしたレイアウトの乱れは、次の操作で解消できます。

  1. コマンドパレットで View: Reset View Locations と入力して実行します。
  2. 全てのビューの位置が初期状態に戻るため、左側のアクティビティバーに戻って Azure アイコンをクリックし、「リソース」ビューが表示されるか確認します。

複数モニタや縦長レイアウトで作業していると、意図せずビューを切り離してしまい「どこかに消えた」ように見える場合もあるため、まずはレイアウトのリセットが有効です。

ワークスペースの信頼(制限付きモード)を確認する

VS Code には、セキュリティのために「このフォルダーを信頼するかどうか」を制御する ワークスペースの信頼 という仕組みがあります。信頼されていないフォルダー(制限付きモード)の場合、一部の拡張機能は動作が制限され、ビューが表示されないことがあります。

制限付きモードの解除手順

  • ウィンドウ上部に「このフォルダーは制限付きモードで開かれています」といったバナーが表示されている場合は、そこにある 「このワークスペースを信頼する」 ボタンをクリックします。
  • 表示される確認ダイアログで、対象フォルダーを信頼する旨を選択します。
  • 必要に応じてウィンドウの再読み込みが促されるので、指示に従います。

信頼されていないワークスペースでは、拡張側で安全のためにビューを出さない実装になっていることが多く、「あるプロジェクトでは Azure が見えるのに、別のフォルダーでは見えない」といった現象につながります。

リモート環境(WSL/SSH/コンテナ)使用時のインストール先に注意

WSL、SSH、Dev Containers などのリモート開発機能を使っている場合、拡張機能は ローカル側 と リモート側 のどちらにインストールされているかで挙動が変わります。Azure 関連拡張が「ローカルにしか入っていない」状態だと、リモート接続時に期待通りに動かないケースがあります。

使用中の環境確認ポイント推奨インストール先
ローカルのみ(通常の VS Code)特になしローカルに Azure Tools / Azure Account / Azure Resources をインストール
WSL: Ubuntu など左下ステータスバーに「WSL: Ubuntu」と表示されているか拡張機能ビューでインストール先を「WSL: Ubuntu」に切り替えて Azure 拡張をインストール
Remote-SSH 接続左下に接続先ホスト名が表示されているかリモートホスト側に Azure 拡張をインストール(必要に応じてローカルにも)
Dev Containers / Codespaces左下にコンテナ名/Codespace 名が表示されているかコンテナ側/Codespaces 側に Azure 拡張をインストール

拡張機能ビューの右上には「インストール先」を示すドロップダウン(または拡張ごとのインストールボタン)があり、「ローカル」「WSL」「SSH」「コンテナ」などを切り替えることができます。現在どの環境に接続しているかは、左下ステータスバーの表示を確認すると分かりやすいです。

ネットワーク/プロキシ設定の影響を確認する

企業ネットワークやプロキシ、SSL 検査などが挟まる環境では、ブラウザからのサインイン自体は成功しても、VS Code から Azure へのバックエンド通信がブロックされ、「サインインはできているのにリソースが取れない」という状態になることがあります。

VS Code 側のプロキシ設定を確認

  1. [ファイル] → [ユーザー設定] → [設定] を開きます。
  2. 検索ボックスに proxy と入力します。
  3. 次の設定を確認します。
    • HTTP: Proxy(http.proxy)… 組織で規定されているプロキシ URL を設定する必要がある場合があります。
    • Proxy Support(http.proxySupport)… on / override などの値をネットワーク要件に合わせて設定します。

組織でブラウザ経由のアクセスだけ許可し、独自クライアントからのアクセスを制限しているケースもあるため、社内のネットワーク管理者に VS Code から Azure への通信が許可されているか、確認してもらうのも有効です。

サインアウト → サインインのやり直し

ネットワークや認証まわりの問題で中途半端な状態になっている場合、次の手順でリセットすると復旧することがあります。

  1. コマンドパレットから Azure: Sign Out を実行し、全アカウントからサインアウトします。
  2. VS Code を一度終了し、再起動します。
  3. 再起動後、Azure: Sign In で再度サインインし、Azure: Select Subscriptions でサブスクリプションを選び直します。

ウィンドウの再読み込みと拡張機能の再インストール

ここまでの設定を見直しても Azure リソースビューが表示されない場合は、VS Code 自体や拡張機能の不整合が疑われます。まずは「再読み込み」、それでもダメなら「再インストール」を試します。

Developer: Reload Window でウィンドウを再読み込み

  1. コマンドパレットで Developer: Reload Window を実行します。
  2. VS Code が一瞬閉じて開き直されるので、Azure ビューを再度確認します。

VS Code を完全終了 → 再起動するのと似ていますが、ウィンドウ単位でクリーンに再読み込みできるため、拡張のアップデート直後などに起きる不具合に対して特に有効です。

Azure 関連拡張のアンインストール → 再インストール

それでも解決しない場合は、Azure 関連拡張を一度削除し、再インストールしてみます。

  1. 拡張機能ビューから Azure Tools を開き、アンインストール をクリックします。
  2. 関連する Azure 拡張(Azure Account / Azure Resources など)が残っていれば、同様にアンインストールします。
  3. Developer: Reload Window でウィンドウを再読み込みします。
  4. 再度拡張機能ビューを開き、Azure Tools を検索してインストールします。

環境によっては、VS Code のバージョンアップや拡張の自動更新により、拡張側の依存関係やキャッシュが壊れることがあります。再インストールにより、必要なコンポーネントがクリーンな状態で入れ直されます。

それでもダメな場合:GitHub での報告が近道

ここまで実施しても Azure のリソースビューが表示されない場合は、単純な設定の問題ではなく、拡張機能または VS Code 本体の不具合である可能性が高くなります。Microsoft Q&A では「VS Code のサポートは GitHub リポジトリを利用するように」と案内されており、実際 GitHub に報告する方が開発チームからの回答も得やすくなっています。

GitHub に報告する際にまとめておきたい情報

  • 問題が発生している画面のスクリーンショット
    • 左側のアクティビティバーが写るようにする
    • Azure にサインイン済みであることが分かる部分(ステータスバーなど)を含める
  • VS Code のバージョン([ヘルプ] → [バージョン情報] からコピー)
  • Azure 関連拡張のバージョン一覧(拡張機能ビューの「…」→「拡張機能の一覧をコピー」など)
  • 使用 OS(Windows / macOS / Linux とそのバージョン)
  • リモート環境(WSL / SSH / コンテナ)の有無
  • [出力] パネルの Azure Account チャネルのログ抜粋(エラーらしき箇所)
  • 試した対処内容(本記事のどのステップまで実施したか)

これらの情報を添えて GitHub のイシューとして投稿することで、開発者側も原因を特定しやすくなります。
「どの操作をしたらどうなったか」を時系列で書いておくと、後から読み返すときにも役立ちます。

補足:Visual Studio と Visual Studio Code の混同に注意

Microsoft Q&A やコミュニティで特に多いのが、Visual Studio(フル IDE) と Visual Studio Code(エディタ) の混同です。

  • Visual Studio(例:Visual Studio 2022)
    • .NET / C# / C++ などの開発向けフル機能 IDE
    • Azure 関連機能も多数搭載されるが、VS Code の拡張とは別物
  • Visual Studio Code
    • 軽量なコードエディタ。拡張機能で機能を追加する形
    • Azure 拡張もこの VS Code に対してインストールする必要がある

「VS を最新にしたのに Azure のリソースが表示されない」という場合、更新したのは Visual Studio 側だけで、VS Code 側の Azure 拡張が古い(または入っていない)ということが少なくありません。
問題が起きているのはどちらの製品なのかを切り分けるために、まずはアプリケーションタイトルバーやアイコンを確認し、VS Code 側で Azure 拡張がインストール・有効化されているかを改めてチェックしましょう。

ひとまず試したい“即効チェック手順”まとめ

ここまでの内容を「今まさに困っている人向け」に最短手順としてまとめると、次のようになります。

  1. VS Code を起動し、[表示] → [外観] → [アクティビティバーを表示] にチェックが入っていることを確認。
  2. 拡張機能ビューで Azure Tools と Azure Account がインストール済みかつ「有効」になっていることを確認。
  3. コマンドパレットで Azure: Sign In を実行してサインインし直す。
  4. 続けて Azure: Select Subscriptions を実行し、表示したいサブスクリプションにチェックを入れる。
  5. Azure ビューを開き、更新(Refresh) アイコンをクリック。
  6. 変化がなければ、コマンドパレットから View: Reset View Locations を実行し、ビュー配置を初期化。
  7. それでも表示されない場合、Developer: Reload Window を実行し、改善しないようであれば Azure 拡張をアンインストール → 再インストール。
  8. 企業ネットワークや VPN を使用している場合は、プロキシ設定やネットワークポリシーも合わせて確認。

上記の手順で多くのケースは解消できますが、根本原因は環境ごとに異なります。再発を防ぐためにも、「どのタイミングから表示されなくなったか」「直前に VS Code や拡張をアップデートしていないか」「ネットワークやアカウントに変更がなかったか」をメモしておくと、次にトラブルが起きた際の手掛かりになります。

再発防止のためのちょっとしたコツ

最後に、同じ問題を繰り返さないためのポイントをいくつか挙げておきます。

  • 拡張機能の自動更新のタイミングを把握する
    大規模プロジェクトを触る前やデモ前など、環境を安定させておきたい時期には、自動更新後に一度 Azure ビューを開いて動作確認しておくと安心です。
  • アカウント/テナント別にプロファイルを分ける
    VS Code のユーザープロファイル機能を利用し、個人用/会社用などアカウントやテナントごとにプロファイルを分けておくと、「どのアカウントでサインインしていたか」が明確になり、トラブルを減らせます。
  • ネットワーク変更時は Azure ビューを軽くチェック
    VPN の ON/OFF、社内外ネットワークの切り替え直後は、Azure ビューのサインイン状態やリソース一覧を軽く確認しておくと、問題が起きたときに原因を特定しやすくなります。
  • チームでトラブルシュート手順を共有しておく
    本記事のようなチェックリストをチームの Wiki や社内ポータルに転載しておくと、メンバー全員のトラブル対応が速くなります。

VS Code の Azure リソースビューが表示されない問題は、一見すると単純なようで、拡張機能・サインイン・ビュー配置・ネットワーク・リモート環境など、複数の要素が同時に絡むことが多いトピックです。今回紹介したチェックリストを上から順に確認していけば、「どこに問題があったのか」を切り分けながら、効率よく原因にたどり着けるはずです。

この記事を書いた人

実務の現場で詰まりがちなポイントを地図にするITブログ「IT trip」を運営。Windows/Office(Teams・Excel)からSQL、サーバ運用、ガジェットまで、再現性のある手順と“なぜそうなるか”を丁寧に解説します。読んだらすぐ試せること、そして迷った人の次の一歩が見えることを大切にしています。

コメント

コメントする

目次