🚀 VS Codeでで入手!

拡張機能マーケットプレイス

Visual Studio Code に標準で含まれている機能はほんの始まりに過ぎません。VS Code 拡張機能を使用すると、開発ワークフローをサポートするために、言語、デバッガー、ツールをインストールに追加できます。VS Code の豊富な拡張機能モデルにより、拡張機能の作成者は VS Code UI に直接プラグインし、VS Code で使用されているのと同じ API を介して機能を提供できます。この記事では、Visual Studio Code Marketplace から VS Code 拡張機能を見つけ、インストールし、管理する方法について説明します。

拡張機能を閲覧する

VS Code 内から拡張機能を閲覧およびインストールできます。VS Code のサイドにあるアクティビティバーの拡張機能アイコンをクリックするか、[表示] > [拡張機能] コマンド (⇧⌘X (Windows、Linux Ctrl+Shift+X)) を使用して、拡張機能ビューを表示します。

Extensions view icon

これにより、VS Code Marketplace で最も人気のある VS Code 拡張機能のリストが表示されます。

popular extensions

リスト内の各拡張機能には、簡単な説明、発行元、ダウンロード数、5つ星評価が含まれています。拡張機能アイテムを選択すると、拡張機能の詳細ページが表示され、詳細を確認できます。

注意

コンピューターのインターネットアクセスがプロキシサーバーを経由する場合、プロキシサーバーを構成する必要があります。詳細については、プロキシサーバーのサポートを参照してください。

拡張機能をインストールする

拡張機能をインストールするには、[インストール] ボタンを選択します。インストールが完了すると、[インストール] ボタンが [管理] ギアボタンに変わります。

重要

拡張機能は VS Code 自体と同じアクセス許可を持っています。VS Code リリース 1.97 以降では、サードパーティの発行元から拡張機能を初めてインストールするときに、VS Code は拡張機能の発行元を信頼するかどうかを確認するダイアログを表示します。拡張機能のランタイムセキュリティと、悪意のある拡張機能から身を守る方法の詳細をご覧ください。

拡張機能の特定のバージョンをインストールする場合は、拡張機能を右クリックし、[別のバージョンをインストール] を選択します。次に、利用可能なリストからバージョンを選択できます。

設定同期が有効になっている場合、拡張機能などの VS Code 構成をマシン間で共有できます。拡張機能をインストールし、マシン間で同期しないようにするには、拡張機能を右クリックし、[インストール (同期しない)] を選択します。

拡張機能を見つけてインストールする

たとえば、人気のある TODO Highlight 拡張機能をインストールしてみましょう。この拡張機能は、ソースコード内の 'TODO:' や 'FIXME:' などのテキストを強調表示して、未完了のセクションをすばやく見つけられるようにします。

TODO Highlight extension highlighting in the editor

拡張機能ビュー (⇧⌘X (Windows、Linux Ctrl+Shift+X)) で、検索ボックスに「todo」と入力して、Marketplace のオファリングをタイトルまたはメタデータに「todo」が含まれる拡張機能に絞り込みます。リストに TODO Highlight 拡張機能が表示されるはずです。

Search for todo in the Extensions view

拡張機能は、発行元と拡張機能 ID によって一意に識別されます。TODO Highlight 拡張機能を選択すると、拡張機能の詳細ページが表示され、拡張機能 ID (この場合は wayou.vscode-todo-highlight) を見つけることができます。拡張機能 ID を知っておくと、名前が似た拡張機能が複数ある場合に役立ちます。

TODO Highlight extension details with extension ID highlighted

[インストール] ボタンを選択すると、VS Code は Marketplace から拡張機能をダウンロードしてインストールします。インストールが完了すると、[インストール] ボタンが [管理] ギアボタンに置き換えられます。

Manage gear button

TODO Highlight 拡張機能の動作を確認するには、任意のソースコードファイルを開き、「TODO:」というテキストを追加すると、テキストが強調表示されます。

TODO Highlight 拡張機能は、コマンドパレット (⇧⌘P (Windows、Linux Ctrl+Shift+P)) で見つけることができる TODO-Highlight: List highlighted annotations および TODO-Highlight: Toggle highlight コマンドを提供します。TODO-Highlight: Toggle highlight コマンドを使用すると、強調表示をすばやく無効または有効にできます。

TODO Highlight commands in the Command Palette

拡張機能は、その動作を調整するための設定も提供しており、設定エディター (⌘, (Windows、Linux Ctrl+,)) で見つけることができます。たとえば、テキスト検索を大文字と小文字を区別しないようにしたい場合は、[Todohighlight: Is Case Sensitive] 設定のチェックを外すことができます。

TODO Highlight settings in the Settings editor

拡張機能が必要な機能を提供しない場合は、いつでも [管理] ボタンのコンテキストメニューから拡張機能を [アンインストール] できます。

Uninstall the TODO Highlight extension

これは、拡張機能をインストールして使用する方法のほんの一例です。VS Code Marketplace には、何百ものプログラミング言語とタスクをサポートする数千もの拡張機能があります。JavaPythonGoC++ のフル機能の言語サポートから、GUID を作成したり、カラーテーマを変更したり、仮想ペットをエディターに追加したりする単純な拡張機能まで、あらゆるものが揃っています。

拡張機能の詳細

拡張機能の詳細ページでは、拡張機能の README を読み、拡張機能の

  • 機能のコントリビューション - 設定、コマンドとキーボードショートカット、言語文法、デバッガーなど、拡張機能が VS Code に追加したもの。
  • 変更履歴 - 利用可能な場合は、拡張機能リポジトリの CHANGELOG。
  • 依存関係 - 拡張機能が他の拡張機能に依存しているかどうかをリスト表示します。

extension contributions

拡張機能が拡張機能パックの場合、[拡張機能パック] セクションには、パックをインストールしたときにインストールされる拡張機能が表示されます。拡張機能パックは、個別の拡張機能をまとめてバンドルすることで、一度に簡単にインストールできるようにします。

Azure Tools extension pack

拡張機能ビューフィルターとコマンド

[拡張機能フィルター] コンテキストメニューを使用して、拡張機能ビューをフィルター処理できます。

Extensions view filter context menu

次のフィルターがあります。

  • 更新できる期限切れの拡張機能のリスト
  • 現在有効/無効になっている拡張機能のリスト
  • ワークスペースに基づいたおすすめの拡張機能のリスト
  • グローバルに人気のある拡張機能のリスト

拡張機能リストは、インストール数評価名前公開日、または 更新日 で昇順または降順に並べ替えることができます。拡張機能の検索フィルターの詳細については、下記をご覧ください。

... [表示とその他のアクション] ボタンから、追加の拡張機能ビューコマンドを実行できます。

more button

このコンテキストメニューから、拡張機能の更新を制御したり、すべての拡張機能を有効または無効にしたり、拡張機能の二分法ユーティリティを使用して、問題のある拡張機能の動作を特定したりできます。

拡張機能を検索する

拡張機能ビューの上部にある [検索] ボックスをクリアし、探している拡張機能、ツール、またはプログラミング言語の名前を入力できます。

たとえば、「python」と入力すると、Python 言語拡張機能のリストが表示されます。

python extensions

探している拡張機能の正確な識別子を知っている場合は、@id: プレフィックス (例: @id:vue.volar) を使用できます。さらに、結果をフィルター処理または並べ替えるには、フィルターおよび 並べ替えコマンドを下記で詳しく説明します。

プレリリース拡張機能バージョンをインストールする

拡張機能の発行元は、拡張機能のプレリリースバージョンを提供している場合があります。プレリリースバージョンをインストールするには、[インストール] ボタンのドロップダウンを選択し、[プレリリースバージョンのインストール] を選択します。

Install pre-release version

拡張機能を管理する

VS Code では、拡張機能を簡単に管理できます。拡張機能ビュー、コマンドパレット ([拡張機能:] プレフィックス付きのコマンド) またはコマンドラインスイッチを使用して、拡張機能をインストール、無効化、更新、およびアンインストールできます。

インストールされている拡張機能をリスト表示する

デフォルトでは、拡張機能ビューには、現在インストールされている拡張機能と、おすすめされているすべての拡張機能が表示されます。[拡張機能: インストール済みのビューにフォーカス] コマンドを、コマンドパレット (⇧⌘P (Windows、Linux Ctrl+Shift+P)) または [その他のアクション] (...) ドロップダウンメニュー > [ビュー] > [インストール済み] で使用して、検索ボックス内のテキストをクリアし、無効になっている拡張機能を含む、インストールされているすべての拡張機能のリストを表示します。

拡張機能をアンインストールする

拡張機能をアンインストールするには、拡張機能エントリの右側にある [管理] ギアボタンを選択し、ドロップダウンメニューから [アンインストール] を選択します。これにより、拡張機能がアンインストールされ、拡張機能ホストを再起動するように求められます ([拡張機能を再起動])。

uninstall an extension

拡張機能を無効にする

拡張機能を完全に削除したくない場合は、代わりに拡張機能エントリの右側にあるギアボタンをクリックして、拡張機能を一時的に無効にすることができます。拡張機能をグローバルに無効にするか、現在のワークスペースでのみ無効にすることができます。拡張機能を無効にした後、拡張機能ホストを再起動するように求められます ([拡張機能を再起動])。

インストールされているすべての拡張機能をすばやく無効にしたい場合は、コマンドパレット[その他のアクション] (...) ドロップダウンメニューに [インストールされているすべての拡張機能を無効にする] コマンドがあります。

拡張機能は、再度有効にするまで、すべての VS Code セッションで無効のままになります。

拡張機能を有効にする

同様に、拡張機能を無効にした場合 (リストの [無効] セクションに表示され、[無効] とマークされます)、ドロップダウンメニューの [有効にする] または [有効にする (ワークスペース)] コマンドを使用して再度有効にすることができます。

enable extension

[その他のアクション] (...) ドロップダウンメニューには、[すべての拡張機能を有効にする] コマンドもあります。

拡張機能の自動更新

VS Code は拡張機能の更新をチェックし、自動的にインストールします。更新後、拡張機能ホストを再起動するように求められます ([拡張機能を再起動])。

拡張機能を手動で更新したい場合は、[すべての拡張機能の自動更新を無効にする] コマンドまたは拡張機能ビューの対応するアクションを使用して自動更新を無効にできます。また、extensions.autoUpdate 設定を構成することもできます。自動更新を再度有効にするには、[すべての拡張機能の自動更新を有効にする] コマンドを使用します。

Disable auto update for all extensions action

拡張機能を右クリックして [自動更新] アイテムを切り替えることで、個々の拡張機能の自動更新を構成することもできます。

VS Code に更新をチェックさせたくない場合は、extensions.autoCheckUpdates 設定を false に設定できます。

拡張機能を手動で更新する

拡張機能の自動更新を無効にしている場合は、@updates フィルターを使用する [期限切れの拡張機能を表示] コマンドを使用して、拡張機能の更新をすばやく確認できます。これにより、現在インストールされている拡張機能で使用可能な更新プログラムが表示されます。

期限切れの拡張機能の [更新] ボタンを選択します。更新プログラムがインストールされ、拡張機能ホストを再起動するように求められます ([拡張機能を再起動])。[すべての拡張機能を更新] コマンドを使用すると、期限切れのすべての拡張機能を一度に更新することもできます。

更新の自動チェックも無効にしている場合は、[拡張機能の更新をチェック] コマンドを使用して、更新できる拡張機能を確認できます。

[おすすめの拡張機能を表示] を使用して、おすすめの拡張機能のリストを表示できます。これにより、@recommended フィルターが設定されます。拡張機能のおすすめは、次のいずれかになります。

  • ワークスペースのおすすめ - 現在のワークスペースの他のユーザーによって推奨されています。
  • その他のおすすめ - 最近開いたファイルに基づいて推奨されています。

プロジェクト内の他のユーザーにおすすめを 提供する 方法については、以下のセクションをご覧ください。

おすすめを無視する

おすすめを非表示にするには、拡張機能アイテムを選択して [詳細] ページを開き、[管理] ギアボタンを選択してコンテキストメニューを表示します。[おすすめを無視] メニューアイテムを選択します。無視されたおすすめは、今後おすすめされなくなります。

Ignore extension recommendation

拡張機能の構成

VS Code 拡張機能には、非常に異なる構成と要件がある場合があります。一部の拡張機能は、設定エディターで変更できる 設定を VS Code に提供します。他の拡張機能には、独自の構成ファイルがある場合があります。拡張機能には、コンパイラ、デバッガー、コマンドラインツールなどの追加コンポーネントのインストールとセットアップが必要な場合もあります。拡張機能の README (拡張機能ビューの詳細ページに表示) を参照するか、VS Code Marketplace の拡張機能ページにアクセスしてください (詳細ページで拡張機能名をクリックします)。多くの拡張機能はオープンソースであり、Marketplace ページにリポジトリへのリンクがあります。

コマンドライン拡張機能管理

VS Code の自動化と構成を容易にするために、コマンドラインから拡張機能をリスト表示、インストール、およびアンインストールできます。拡張機能を識別するときは、publisher.extension 形式の完全な名前 (例: ms-python.python) を指定します。

code --extensions-dir <dir>
    Set the root path for extensions.
code --list-extensions
    List the installed extensions.
code --show-versions
    Show versions of installed extensions, when using --list-extension.
code --install-extension (<extension-id> | <extension-vsix-path>)
    Installs an extension.
code --uninstall-extension (<extension-id>)
    Uninstalls an extension.
code --enable-proposed-api (<extension-id>)
    Enables proposed API features for extensions. Can receive one or more extension IDs to enable individually.

拡張機能 ID は、[Marketplace 情報] の下の拡張機能の詳細ページに表示されます。

extension identifier

拡張機能ビューフィルター

拡張機能ビューの検索ボックスは、拡張機能の検索と管理に役立つフィルターをサポートしています。[インストール済みの拡張機能を表示] および [おすすめの拡張機能を表示] コマンドを使用した場合は、@installed@recommended などのフィルターが表示されている場合があります。また、人気度や評価で並べ替えたり、カテゴリ (例: 「リンター」) やタグ (例: 「node」) で検索したりできるフィルターもあります。すべてのフィルターと並べ替えコマンドの完全なリストを表示するには、拡張機能の検索ボックスに @ と入力し、候補をナビゲートします。

intellisense on extension search filters

拡張機能ビューフィルターの例を次に示します。

  • @builtin - VS Code に付属している拡張機能を表示します。種類 (プログラミング言語、テーマなど) 別にグループ化されています。
  • @deprecated - 非推奨の拡張機能を表示します。
  • @disabled - 無効になっているインストール済みの拡張機能を表示します。拡張機能は個別に有効/無効にできます。
  • @enabled - 有効になっているインストール済みの拡張機能を表示します。拡張機能は個別に有効/無効にできます。
  • @featured - おすすめの拡張機能を表示します。
  • @installed - インストール済みの拡張機能を表示します。
  • @popular - 人気のある拡張機能を表示します。
  • @recentlyPublished - Marketplace で最近公開された拡張機能を表示します。
  • @recommended - おすすめの拡張機能を表示します。ワークスペース固有または一般的な用途としてグループ化されています。
  • @updates - 期限切れのインストール済み拡張機能を表示します。Marketplace で新しいバージョンが利用可能です。
  • @workspaceUnsupported - このワークスペースでサポートされていない拡張機能を表示します。
  • @category - 指定されたカテゴリに属する拡張機能を表示します。以下は、サポートされているカテゴリの一部です。完全なリストについては、@category と入力し、候補リストのオプションに従ってください。
    • @category:themes
    • @category:formatters
    • @category:linters
    • @category:snippets

これらのフィルターは組み合わせることもできます。例: インストールされているすべてのテーマを表示するには、@installed @category:themes を使用します。

フィルターが指定されていない場合、拡張機能ビューには現在インストールされている拡張機能とおすすめの拡張機能が表示されます。

並べ替え

@sort フィルターを使用して拡張機能を並べ替えることができます。このフィルターには、次の値を指定できます。

  • installs - Marketplace インストール数で降順に並べ替えます。
  • name - 拡張機能名でアルファベット順に並べ替えます。
  • publishedDate - 拡張機能の公開日で並べ替えます。
  • rating - Marketplace 評価 (1 ~ 5 つ星) で降順に並べ替えます。
  • updateDate - 拡張機能の最終更新日で並べ替えます。

sort by install count

カテゴリとタグ

拡張機能は、機能を表す カテゴリタグを設定できます。

extension categories and tags

カテゴリとタグでフィルター処理するには、category: および tag: を使用します。

サポートされているカテゴリは、[Azure, Data Science, Debuggers, Education, Extension Packs, Formatters, Keymaps, Language Packs, Linters, Machine Learning, Notebooks, Others, Programming Languages, SCM Providers, Snippets, Testing, Themes, Visualization] です。これらは、拡張機能の検索ボックスの IntelliSense を介してアクセスできます。

categories debuggers

カテゴリ名が複数語の場合は、引用符で囲む必要があることに注意してください (例: category:"SCM Providers")。

タグには任意の文字列を含めることができ、IntelliSense では提供されないため、Marketplace を確認して役立つタグを見つけてください。

VSIX からインストール

.vsix ファイルにパッケージ化された VS Code 拡張機能を手動でインストールできます。拡張機能ビューのコマンドドロップダウンにある [VSIX からインストール] コマンド、または コマンドパレット[拡張機能: VSIX からインストール] コマンドを使用して、.vsix ファイルをポイントします。

VS Code --install-extension コマンドラインスイッチを使用して、.vsix ファイルへのパスを指定してインストールすることもできます。

code --install-extension myextension.vsix

--install-extension をコマンドラインで複数回指定して、複数の拡張機能を一度にインストールできます。

注意

VSIX 経由で拡張機能をインストールすると、その拡張機能の 自動更新 はデフォルトで無効になります。

拡張機能のパッケージングと公開の詳細については、拡張機能 API の 拡張機能の公開に関する記事をご覧ください。

適切な拡張機能のセットを使用すると、特定のワークスペースまたはプログラミング言語での作業がより生産的になり、このリストをチームや同僚と共有したいと思うことがよくあります。[拡張機能: おすすめの拡張機能の構成 (ワークスペースフォルダー)] コマンドを使用して、ワークスペースにおすすめの拡張機能リストを作成できます。

単一フォルダーワークスペースでは、このコマンドにより、ワークスペースの .vscode フォルダーにある extensions.json ファイルが作成され、拡張機能識別子 ({publisherName}.{extensionName}) のリストを追加できます。

マルチルートワークスペースでは、このコマンドにより、.code-workspace ファイルが開き、extensions.recommendations の下に拡張機能をリスト表示できます。[拡張機能: おすすめの拡張機能の構成 (ワークスペースフォルダー)] コマンドを使用すると、マルチルートワークスペース内の個々のフォルダーに拡張機能のおすすめを追加することもできます。

extensions.json の例を次に示します。

{
  "recommendations": ["dbaeumer.vscode-eslint", "esbenp.prettier-vscode"]
}

これは、リンター拡張機能とコードフォーマッター拡張機能をおすすめしています。

拡張機能は、発行元識別子と拡張機能識別子 publisher.extension を使用して識別されます。名前は、拡張機能の詳細ページで確認できます。VS Code は、これらのファイル内でインストールされている拡張機能のオートコンプリートを提供します。

Extension identifier.

ワークスペースが初めて開かれたときに、VS Code はおすすめの拡張機能をインストールするようにユーザーに促します。ユーザーは、[拡張機能: おすすめの拡張機能を表示] コマンドでリストを確認することもできます。

Show Recommendations

次のステップ

興味深いと思われるトピックをいくつかご紹介します...

よくある質問

拡張機能はどこにインストールされますか?

拡張機能は、ユーザーごとの拡張機能フォルダーにインストールされます。プラットフォームによって、場所は次のフォルダーになります。

  • Windows %USERPROFILE%\.vscode\extensions
  • macOS ~/.vscode/extensions
  • Linux ~/.vscode/extensions

--extensions-dir <dir> コマンドライン オプションを使用して VS Code を起動することで、場所を変更できます。

拡張機能をインストールしようとすると、ETIMEDOUT エラーが発生します。

マシンがプロキシサーバーを経由してインターネットにアクセスしている場合に、このエラーが表示されることがあります。詳細については、セットアップトピックの プロキシサーバーのサポート セクションをご覧ください。

Marketplace から拡張機能を直接ダウンロードできますか?

一部のユーザーは、Marketplace から拡張機能を一度ダウンロードし、ローカル共有から複数の VS Code インスタンスにインストールすることを好みます。これは、接続に関する懸念がある場合や、開発チームが固定された拡張機能セットを使用したい場合に役立ちます。

拡張機能をダウンロードするには、拡張機能ビューで拡張機能を検索し、結果から拡張機能を右クリックして、[VSIX のダウンロード] を選択します。

注意

ダウンロードオプションは VS Code リリース 1.96 以降で利用可能になり、まだインストールされていない拡張機能でのみ利用可能です。

VS Code が拡張機能のおすすめを提供しないようにすることはできますか?

はい。VS Code に拡張機能ビューまたは通知でおすすめを表示しないようにする場合は、次の設定を変更できます。

  • extensions.showRecommendationsOnlyOnDemand - [おすすめ] セクションを削除するには、true に設定します。
  • extensions.ignoreRecommendations - 拡張機能のおすすめ通知を非表示にするには、true に設定します。

おすすめを確認する場合は、[おすすめの拡張機能を表示] コマンドをいつでも使用できます。

Marketplace の拡張機能を信頼できますか?

Visual Studio Marketplace は、悪意のある拡張機能からユーザーを保護するためにいくつかの対策を講じており、拡張機能をインストールする前に、拡張機能が信頼できるかどうかを判断するためにさまざまな手順を実行することもできます。

VS Code リリース 1.97 以降では、サードパーティの発行元から拡張機能を初めてインストールするときに、VS Code は拡張機能の発行元を信頼するかどうかを確認するダイアログを表示します。

拡張機能のランタイムセキュリティの詳細をご覧ください。

拡張機能の署名を VS Code で検証できません。

Visual Studio Marketplace は、すべての拡張機能が公開されるときに署名します。VS Code は、拡張機能をインストールするときにこの署名を検証して、拡張機能パッケージの整合性とソースを確認します。

拡張機能をインストールすると、次のエラーメッセージが表示される場合があります: 拡張機能の署名を Visual Studio Code で検証できないため、拡張機能をインストールできません

このエラーは、サポートされていない環境や (可能性は低いですが) パッケージの整合性の問題など、さまざまな原因によって発生する可能性があります。このエラーが発生した場合は、とにかくインストールすることを決定する前に注意してください。

問題を報告するには、Visual Studio Marketplace チームに連絡することをおすすめします。必ず拡張機能 ID を含めてください。拡張機能の署名検証を無効にする場合は、extensions.verifySignature 設定を使用できます。

リモートウィンドウに接続すると、拡張機能が同期されません。

設定同期を使用すると、設定、キーボードショートカット、インストールされている拡張機能などの Visual Studio Code 構成をマシン間で共有できるため、常に好みの設定で作業できます。

VS Code は、SSH、開発コンテナ (devcontainer)、WSL など、リモートウィンドウとの間で拡張機能を同期しません。

組織内で特定の拡張機能を許可またはブロックできますか?

extensions.allowed アプリケーション設定を構成することで、組織内でインストールできる拡張機能を制御できます。設定が構成されていない場合、すべての拡張機能が許可されます。設定が構成されている場合、リストにないすべての拡張機能はインストールがブロックされます。

許可された拡張機能の構成の詳細をご覧ください。