🚀 VS Code で で入手しましょう!

拡張機能ガイド

Hello World サンプルで Visual Studio Code 拡張機能 API の基本を学んだら、実際の拡張機能を構築する時が来ました。「拡張機能の機能」セクションでは、拡張機能ができることの概要を説明していますが、このセクションには、特定の VS Code API の使用方法を説明する詳細なコードガイドとサンプルのリストが含まれています。

各ガイドまたはサンプルでは、以下が期待できます。

  • 詳細なコメント付きのソースコード。
  • サンプル拡張機能の使用状況を示す GIF または画像。
  • サンプル拡張機能を実行するための手順。
  • 使用されている VS Code API のリスト。
  • 使用されている機能拡張ポイントのリスト。
  • サンプルに似た実際の拡張機能。
  • API の概念の説明。

ガイドとサンプル

VS Code ウェブサイトのガイドを以下に示します。これには、VS Code API機能拡張ポイント の使用方法が含まれています。拡張機能を作成するためのユーザーインターフェースのベストプラクティスを学ぶには、UX ガイドラインを参照することを忘れないでください。

VS Code ウェブサイトのガイド API と機能拡張
コマンド commands
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 サンプル commands
StatusBarItem
window.createStatusBarItem
TextEditorCursorStyle
window.activeTextEditor
Position
Range
Selection
TextEditor
TextEditorRevealType
TextDocument
ソース管理サンプル workspace.workspaceFolders
SourceControl
SourceControlResourceGroup
scm.createSourceControl
TextDocumentContentProvider
contributes.menus
コメント API サンプル
ドキュメント編集サンプル commands
contributes.commands
はじめにサンプル 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 ログストリーミングサンプル N/A
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