12周年記念パーティ開催! 2024/5/10(金) 19:00

VS Code拡張機能開発

全6回

Visual Studio Codeにさまざまな便利な機能を追加する拡張機能は、利用するだけでなく、自分で開発することもできます。簡単な拡張機能を作成して、開発方法を身につけましょう。

最終回 settings.jsonとの連携によるカスタマイズ

VS Code拡張機能では、settings.jsonや設定画面からカスタマイズできる設定項目をユーザーに提供することができます。さまざまなニーズに応えられる柔軟な拡張機能を目指しましょう。

第5回 UI経由でのコマンドの呼び出し

前回、実装したハイライト箇所までスクロールするコマンドを、ステータスバーのアイテムをクリックすると呼び出せるように実装を進めます。UIとコマンドの紐付け方を解説します。

第4回 ハイライトへスクロールするコマンドの実装

UIをクリックした際の動作は、コマンドという形で指定することができます。VS Codeが提供する組み込みコマンドを使いながら、独自のコマンドを追加してみましょう。

第3回 ステータスバーのカスタマイズ

独自のVS Code拡張機能では、UIに情報を追加することもできます。情報の表示に関しては、VS CodeのUXガイドラインに沿って、情報の分類や色に配慮しながら実装しましょう。

第2回 拡張機能の設計とハイライト表示の実装

VS Code拡張機能はJavaScriptの知識をベースに開発できますが、処理を適切に分離させながら組み立てる必要があります。

第1回 拡張機能プロジェクトのコード構造と処理の流れ

コメントハイライト拡張機能の実現を目指して、まずは推奨されるコードの組み立て方とイベント処理の流れを確認します。