拡張機能の機能概要
Visual Studio Code は、拡張機能がその機能を拡張するための多くの方法を提供しています。適切なコントリビューションポイントやVS Code APIを見つけるのが難しい場合があります。このトピックでは、拡張機能の機能をいくつかのカテゴリに分けて説明します。各カテゴリでは、以下について説明します。
- 拡張機能が利用できる機能
- これらの機能を使用するためのより詳細なトピックへのリンク
- いくつかの拡張機能のアイデア
ただし、VS Code の安定性とパフォーマンスを確保するために、拡張機能には制限も課しています。たとえば、拡張機能は VS Code UI の DOM にアクセスできません。
共通機能
一般的な機能は、どの拡張機能でも使用できるコアな機能です。
これらの機能には、以下が含まれます。
- コマンド、設定、キーバインディング、またはコンテキストメニュー項目を登録する。
- ワークスペースまたはグローバルデータを保存する。
- 通知メッセージを表示する。
- クイックピックを使用してユーザー入力を収集する。
- システムファイルピッカーを開いて、ユーザーがファイルまたはフォルダーを選択できるようにする。
- Progress API を使用して、時間のかかる操作を示す。
テーマ設定
テーマ設定は、エディター内のソースコードの色と VS Code UI の色の両方で、VS Code の外観を制御します。VS Code をさまざまな緑色にして、まるでマトリックスをコーディングしているかのように見せたい場合や、究極のミニマリストなグレースケールワークスペースを作成したい場合は、テーマが役立ちます。
拡張機能のアイデア
- ソースコードの色を変更する。
- VS Code UI の色を変更する。
- 既存の TextMate テーマを VS Code に移植する。
- カスタムファイルアイコンを追加する。
宣言型言語機能
宣言型言語機能は、括弧の対応、自動インデント、シンタックスハイライトなど、プログラミング言語の基本的なテキスト編集サポートを追加します。これは、コードを記述することなく宣言的に行われます。IntelliSense やデバッグなどのより高度な言語機能については、プログラム型言語機能を参照してください。
拡張機能のアイデア
- 一般的な JavaScript のスニペットを拡張機能にバンドルする。
- 新しいプログラミング言語について VS Code に教える。
- プログラミング言語の文法を追加または置換する。
- 文法インジェクションで既存の文法を拡張する。
- 既存の TextMate 文法を VS Code に移植する。
プログラムによる言語機能
プログラム型言語機能は、ホバー、定義への移動、診断エラー、IntelliSense、CodeLens などの豊富なプログラミング言語サポートを追加します。これらの言語機能は、vscode.languages.* API を介して公開されます。拡張機能は、これらの API を直接使用するか、または言語サーバーを記述し、VS Code Language Server ライブラリを使用して VS Code に適合させることができます。
私たちは言語機能とその意図された使用法の一覧を提供していますが、これらの API を創造的に使用することを妨げるものはありません。たとえば、CodeLens とホバーは追加情報をインラインで表示する優れた方法であり、診断エラーはスペルミスやコードスタイルのエラーをハイライトするのに使用できます。
拡張機能のアイデア
- API の使用例を表示するホバーを追加する。
- 診断を使用して、ソースコード内のスペルミスやリンターエラーを報告する。
- HTML の新しいコードフォーマッターを登録する。
- リッチでコンテキストを認識する IntelliSense を提供する。
- 言語のフォールディング、ブレッドクラム、アウトラインサポートを追加する。
ワークベンチ拡張機能
ワークベンチ拡張機能は、VS Code ワークベンチ UI を拡張します。ファイルエクスプローラーに新しい右クリックアクションを追加したり、VS Code のTreeView API を使用してカスタムエクスプローラーを構築することもできます。拡張機能が完全にカスタマイズされたユーザーインターフェースを必要とする場合は、Webview API を使用して、標準の HTML、CSS、JavaScript を使って独自のドキュメントプレビューや UI を構築できます。
拡張機能のアイデア
- ファイルエクスプローラーにカスタムコンテキストメニューアクションを追加する。
- サイドバーに新しいインタラクティブな TreeView を作成する。
- 新しいアクティビティバービューを定義する。
- ステータスバーに新しい情報を表示する。
WebViewAPI を使用してカスタムコンテンツをレンダリングする。- ソース管理プロバイダーに貢献する。
デバッグ
VS Code のデバッグ UI を特定のデバッガーまたはランタイムに接続するデバッガー拡張機能を記述することで、VS Code のデバッグ機能を利用できます。
拡張機能のアイデア
- デバッグアダプターの実装を提供することで、VS Code のデバッグ UI をデバッガーまたはランタイムに接続する。
- デバッガー拡張機能がサポートする言語を指定する。
- デバッガーが使用するデバッグ構成属性に対して、豊富な IntelliSense とホバー情報を提供する。
- デバッグ構成スニペットを提供する。
一方、VS Code はデバッグ拡張 API のセットも提供しており、これを使用すると、任意の VS Code デバッガー上でデバッグ関連の機能を実装し、ユーザーのデバッグエクスペリエンスを自動化できます。
拡張機能のアイデア
- 動的に作成されたデバッグ構成に基づいてデバッグセッションを開始する。
- デバッグセッションのライフサイクルを追跡する。
- プログラムでブレークポイントを作成および管理する。
UX ガイドライン
拡張機能を VS Code ユーザーインターフェースにシームレスに適合させるために、UX ガイドラインを参照してください。そこでは、拡張機能 UI の作成に関するベストプラクティスと、VS Code の推奨ワークフローに従うための慣例を学ぶことができます。
制限事項
拡張機能にはいくつかの制限が課せられています。以下にその制限と目的を示します。
DOM アクセスなし
拡張機能は VS Code UI の DOM にアクセスできません。VS Code にカスタム CSS を適用したり、HTML 要素を VS Code UI に追加したりする拡張機能を記述することはできません。
VS Code では、基盤となるウェブテクノロジーの利用を継続的に最適化し、常に利用可能で応答性の高いエディターを提供することを目指しており、これらのテクノロジーと製品の進化に合わせて DOM の利用を調整し続けます。拡張機能が VS Code の安定性とパフォーマンスを妨げず、既存の拡張機能を壊すことなく VS Code の DOM を改善し続けるために、拡張機能を拡張ホストプロセスで実行し、DOM への直接アクセスを防止しています。
カスタムスタイルシートなし
ユーザーまたは拡張機能によって提供されるカスタムスタイルシートは、DOM 構造やクラス名に反して機能します。これらは内部と見なされているため、ドキュメント化されていません。VS Code を進化させ、リファクタリングし、改善するためには、ユーザーインターフェースに変更を加える自由が必要です。DOM への変更は既存のカスタムスタイルシートを壊す可能性があり、スタイルシートの提供者に不満をもたらし、壊れたスタイルシートに起因する UI の不具合によりユーザーエクスペリエンスが悪化します。
代わりに、VS Code は UI のカスタマイズをサポートする、適切に設計された拡張機能 API の提供を目指しています。この API はドキュメント化されており、ツールとサンプルが付属しており、VS Code の今後のすべてのリリースで安定性が維持されます。