擴充功能指南

在 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 日誌串流範例	不適用
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

02/06/2025