拡張機能ガイド

Hello World サンプルで Visual Studio Code 拡張機能 API の基本を学んだら、次は実際の拡張機能を構築してみましょう。拡張機能の機能セクションでは、拡張機能で何ができるかの概要を説明していますが、このセクションでは、特定の VS Code API の使用方法を解説した詳細なコードガイドとサンプルの一覧を提供します。

各ガイドやサンプルには、以下のものが含まれています。

詳細にコメントされたソースコード。
サンプル拡張機能の使用方法を示す GIF または画像。
サンプル拡張機能の実行手順。
使用されている VS Code API の一覧。
使用されているコントリビューションポイントの一覧。
サンプルに似た実際の拡張機能。
API コンセプトの解説。

ガイドとサンプル

以下は、VS Code ウェブサイトで公開されているガイドであり、VS Code API およびコントリビューションポイントの使用例が含まれています。拡張機能を作成する際のユーザーインターフェイスのベストプラクティスについては、UX ガイドラインを必ず参照してください。

VS Code ウェブサイトのガイド	API とコントリビューション
コマンド	コマンド contributes.commands
カラースキーム	contributes.themes
ファイルアイコンテーマ	contributes.iconThemes
プロダクトアイコンテーマ	contributes.productIconThemes
ツリービュー	window.createTreeView window.registerTreeDataProvider TreeView TreeDataProvider contributes.views contributes.viewsContainers
Webview	window.createWebviewPanel window.registerWebviewPanelSerializer
カスタムエディター	window.registerCustomEditorProvider CustomTextEditorProvider contributes.customEditors
仮想ドキュメント	workspace.registerTextDocumentContentProvider commands.registerCommand window.showInputBox
仮想ワークスペース	workspace.fs capabilities.virtualWorkspaces
ワークスペースの信頼	workspace.isTrusted workspace.onDidGrantWorkspaceTrust capabilities.untrustedWorkspaces
タスクプロバイダー	tasks.registerTaskProvider Task ShellExecution contributes.taskDefinitions
ソース管理	workspace.workspaceFolders SourceControl SourceControlResourceGroup scm.createSourceControl TextDocumentContentProvider contributes.menus
デバッガー拡張機能	contributes.breakpoints contributes.debuggers debug
Markdown 拡張機能	markdown.previewStyles markdown.markdownItPlugins markdown.previewScripts
テスト拡張機能	TestController TestItem
カスタムデータ拡張機能	contributes.html.customData contributes.css.customData

VS Code 拡張機能サンプルリポジトリから、その他のサンプルを以下に示します。

GitHub リポジトリのサンプル	API とコントリビューション
Webview サンプル	window.createWebviewPanel window.registerWebviewPanelSerializer
ステータスバーサンプル	window.createStatusBarItem StatusBarItem
ツリービューサンプル	window.createTreeView window.registerTreeDataProvider TreeView TreeDataProvider contributes.views contributes.viewsContainers
タスクプロバイダーサンプル	tasks.registerTaskProvider Task ShellExecution contributes.taskDefinitions
マルチルートサンプル	workspace.getWorkspaceFolder workspace.onDidChangeWorkspaceFolders
補完プロバイダーサンプル	languages.registerCompletionItemProvider CompletionItem SnippetString
ファイルシステムプロバイダーサンプル	workspace.registerFileSystemProvider
エディターデコレーターサンプル	TextEditor.setDecorations DecorationOptions DecorationInstanceRenderOptions ThemableDecorationInstanceRenderOptions window.createTextEditorDecorationType TextEditorDecorationType contributes.colors
L10N サンプル
ターミナルサンプル	window.createTerminal window.onDidChangeActiveTerminal window.onDidCloseTerminal window.onDidOpenTerminal window.Terminal window.terminals
Vim サンプル	コマンド StatusBarItem window.createStatusBarItem TextEditorCursorStyle window.activeTextEditor Position Range Selection TextEditor TextEditorRevealType TextDocument
ソースコントロールサンプル	workspace.workspaceFolders SourceControl SourceControlResourceGroup scm.createSourceControl TextDocumentContentProvider contributes.menus
コメント API サンプル
ドキュメント編集サンプル	コマンド contributes.commands
Getting Started サンプル	contributes.walkthroughs
テスト拡張機能	TestController TestItem

言語拡張機能のサンプル

これらは言語拡張機能のサンプルです。

サンプル	VS Code ウェブサイトのガイド
スニペットサンプル	/api/language-extensions/snippet-guide
言語設定サンプル	/api/language-extensions/language-configuration-guide
LSP サンプル	/api/language-extensions/language-server-extension-guide
LSP ログストリーミングサンプル	該当なし
LSP マルチルートサーバーサンプル	https://github.com/microsoft/vscode/wiki/Adopting-Multi-Root-Workspace-APIs#language-client--language-server (GitHub リポジトリ Wiki)
LSP Web 拡張機能サンプル	/api/language-extensions/language-server-extension-guide

5/28/2026