擴充功能資訊清單
每個 Visual Studio Code 擴充功能都需要一個資訊清單檔案 package.json
,位於擴充功能目錄結構的根目錄。
欄位
名稱 | 必要 | 類型 | 詳細資訊 |
---|---|---|---|
name |
是 | 字串 |
擴充功能的名稱 - 應全部小寫且不含空格。 名稱在市集中必須是唯一的。 |
version |
是 | 字串 |
與 SemVer 相容的版本。 |
publisher |
是 | 字串 |
發行者識別碼 |
engines |
是 | 物件 |
一個物件,其中至少包含 vscode 鍵,以符合擴充功能 相容 的 VS Code 版本。不能為 * 。例如:^0.10.5 表示與最低 VS Code 版本 0.10.5 相容。 |
license |
字串 |
請參閱 npm 的文件。如果您的擴充功能根目錄中有 LICENSE 檔案,則 license 的值應為 "SEE LICENSE IN <filename>" 。 |
|
displayName |
字串 |
在市集中使用的擴充功能顯示名稱。 顯示名稱在市集中必須是唯一的。 |
|
description |
字串 |
簡短描述您的擴充功能是什麼以及做什麼。 | |
categories |
字串陣列 |
您想要用於擴充功能類別。允許的值:[程式語言, 程式碼片段, 語法檢查器, 佈景主題, 偵錯工具, 格式器, 鍵盤對應, SCM 提供者, 其他, 擴充功能包, 語言包, 資料科學, 機器學習, 可視化, 筆記本, 教育, 測試] |
|
keywords |
陣列 |
一個關鍵字陣列,讓擴充功能更容易被找到。這些關鍵字與市集上的其他擴充功能標籤一起包含在內。此列表目前限制為 5 個關鍵字。 | |
galleryBanner |
物件 |
協助格式化市集標頭以符合您的圖示。請參閱以下詳細資訊。 | |
preview |
布林值 |
設定擴充功能在市集中標記為預覽版。 | |
main |
字串 |
您的擴充功能的進入點。 | |
browser |
字串 |
您的 Web 擴充功能的進入點。 | |
contributes |
物件 |
描述擴充功能貢獻的物件。 | |
activationEvents |
陣列 |
此擴充功能的啟動事件陣列。 | |
badges |
陣列 |
要在市集擴充功能頁面的側邊欄中顯示的核准徽章陣列。每個徽章都是一個物件,包含 3 個屬性:徽章圖片 URL 的 url 、使用者點擊徽章時將追蹤的連結 href 和 description 。 |
|
markdown |
字串 |
控制市集中使用的 Markdown 轉譯引擎。github (預設) 或 standard 。 |
|
qna |
marketplace (預設)、string 、false |
控制市集中的問與答連結。設定為 marketplace 以啟用預設市集問與答網站。設定為字串以提供自訂問與答網站的 URL。設定為 false 以完全停用問與答。 |
|
sponsor |
物件 |
指定使用者可以贊助您的擴充功能的位置。這是一個具有單一屬性 url 的物件,該屬性連結到使用者可以贊助您的擴充功能的頁面。 |
|
dependencies |
物件 |
您的擴充功能需要的任何執行階段 Node.js 相依性。與 npm 的 dependencies 完全相同。 |
|
devDependencies |
物件 |
您的擴充功能需要的任何開發 Node.js 相依性。與 npm 的 devDependencies 完全相同。 |
|
extensionPack |
陣列 |
一個陣列,包含可以一起安裝的擴充功能 ID。擴充功能的 ID 始終為 ${publisher}.${name} 。例如:vscode.csharp 。 |
|
extensionDependencies |
陣列 |
一個陣列,包含此擴充功能所依賴的擴充功能 ID。擴充功能的 ID 始終為 ${publisher}.${name} 。例如:vscode.csharp 。 |
|
extensionKind |
陣列 |
一個陣列,指示擴充功能應在遠端組態中執行的位置。值為 ui (在本機執行)、workspace (在遠端電腦上執行) 或兩者皆可,順序設定偏好設定。例如:[ui, workspace] 表示擴充功能可以在任一位置執行,但偏好在本機電腦上執行。有關更多詳細資訊,請參閱此處。 |
|
scripts |
物件 |
與 npm 的 scripts 完全相同,但具有額外的 VS Code 特定欄位,例如 vscode:prepublish 或 vscode:uninstall。 |
|
icon |
字串 |
至少 128x128 像素(Retina 螢幕為 256x256)的圖示路徑。 | |
pricing |
字串 |
擴充功能的定價資訊。允許的值:Free 、Trial 。預設值:Free 。有關更多詳細資訊,請參閱此處。 |
|
capabilities |
物件 |
一個物件,描述擴充功能在受限工作區中的功能:untrustedWorkspaces 、virtualWorkspaces 。 |
另請查看 npm 的 package.json
參考資料。
範例
以下是一個完整的 package.json
{
"name": "wordcount",
"displayName": "Word Count",
"version": "0.1.0",
"publisher": "ms-vscode",
"description": "Markdown Word Count Example - reports out the number of words in a Markdown file.",
"author": {
"name": "sean"
},
"categories": ["Other"],
"icon": "images/icon.png",
"galleryBanner": {
"color": "#C80000",
"theme": "dark"
},
"pricing": "Free",
"activationEvents": ["onLanguage:markdown"],
"engines": {
"vscode": "^1.0.0"
},
"main": "./out/extension",
"scripts": {
"vscode:prepublish": "node ./node_modules/vscode/bin/compile",
"compile": "node ./node_modules/vscode/bin/compile -watch -p ./"
},
"devDependencies": {
"@types/vscode": "^0.10.x",
"typescript": "^1.6.2"
},
"license": "SEE LICENSE IN LICENSE.txt",
"bugs": {
"url": "https://github.com/microsoft/vscode-wordcount/issues",
"email": "sean@contoso.com"
},
"repository": {
"type": "git",
"url": "https://github.com/microsoft/vscode-wordcount.git"
},
"homepage": "https://github.com/microsoft/vscode-wordcount/blob/main/README.md"
}
市集呈現技巧
以下是一些提示和建議,可讓您的擴充功能在 VS Code 市集上顯示時看起來更棒。
始終使用最新的 vsce
,因此請執行 npm install -g @vscode/vsce
以確保您擁有它。
在您的擴充功能根目錄中建立一個 README.md
Markdown 檔案,我們將在擴充功能詳細資訊的主體(在市集上)中包含其內容。您可以在 README.md
中提供相對路徑的圖片連結。
以下是一些範例
提供良好的顯示名稱和描述。這對於市集和產品顯示非常重要。這些字串也用於 VS Code 中的文字搜尋,擁有相關的關鍵字將有很大幫助。
"displayName": "Word Count",
"description": "Markdown Word Count Example - reports out the number of words in a Markdown file.",
圖示和對比鮮明的橫幅色彩在市集頁面標頭上看起來很棒。theme
屬性指的是橫幅中要使用的字型 - dark
或 light
。
{
"icon": "images/icon.png",
"galleryBanner": {
"color": "#C80000",
"theme": "dark"
}
}
您可以設定幾個選用連結(bugs
、homepage
、repository
),這些連結會顯示在市集的資源區段下。
{
"license": "SEE LICENSE IN LICENSE.txt",
"homepage": "https://github.com/microsoft/vscode-wordcount/blob/main/README.md",
"bugs": {
"url": "https://github.com/microsoft/vscode-wordcount/issues",
"email": "sean@contoso.com"
},
"repository": {
"type": "git",
"url": "https://github.com/microsoft/vscode-wordcount.git"
}
}
市集資源連結 | package.json 屬性 |
---|---|
問題 | bugs:url |
存放庫 | repository:url |
首頁 | homepage |
授權 | license |
為您的擴充功能設定 category
。相同 category
中的擴充功能在市集中會分組在一起,這有助於改善篩選和探索。
注意:僅使用對您的擴充功能有意義的值。允許的值為
[程式語言, 程式碼片段, 語法檢查器, 佈景主題, 偵錯工具, 格式器, 鍵盤對應, SCM 提供者, 其他, 擴充功能包, 語言包, 資料科學, 機器學習, 可視化, 筆記本, 教育, 測試]
。對於一般語言功能(例如語法醒目提示和程式碼完成),請使用程式語言
類別。語言包
類別保留給顯示語言擴充功能(例如,本地化的保加利亞語)。
{
"categories": ["Linters", "Programming Languages", "Other"]
}
核准的徽章
由於安全考量,我們僅允許來自受信任服務的徽章。
我們允許來自以下 URL 前綴的徽章
- api.bintray.com
- api.travis-ci.com
- api.travis-ci.org
- app.fossa.io
- badge.buildkite.com
- badge.fury.io
- badge.waffle.io
- badgen.net
- badges.frapsoft.com
- badges.gitter.im
- badges.greenkeeper.io
- cdn.travis-ci.com
- cdn.travis-ci.org
- ci.appveyor.com
- circleci.com
- cla.opensource.microsoft.com
- codacy.com
- codeclimate.com
- codecov.io
- coveralls.io
- david-dm.org
- deepscan.io
- dev.azure.com
- docs.rs
- flat.badgen.net
- gemnasium.com
- github.com (僅限工作流程)
- gitlab.com
- godoc.org
- goreportcard.com
- img.shields.io
- isitmaintained.com
- marketplace.visualstudio.com
- nodesecurity.io
- opencollective.com
- snyk.io
- travis-ci.com
- travis-ci.org
- visualstudio.com
- vsmarketplacebadges.dev
- www.versioneye.com
注意:請將 vsmarketplacebadge.apphb.com 徽章替換為 vsmarketplacebadges.dev 徽章。
如果您有其他想要使用的徽章,請開啟一個 GitHub issue,我們很樂意查看。
合併擴充功能貢獻
yo code
產生器可讓您輕鬆封裝 TextMate 佈景主題、著色器和程式碼片段,並建立新的擴充功能。當產生器執行時,它會為每個選項建立一個完整的獨立擴充功能包。但是,擁有一個結合多個貢獻的單一擴充功能通常更方便。例如,如果您要新增對新語言的支援,您會希望為使用者提供語言定義與著色,以及程式碼片段,甚至可能包括偵錯支援。
若要合併擴充功能貢獻,請編輯現有的擴充功能資訊清單 package.json
,並新增新的貢獻和相關檔案。
以下是一個擴充功能資訊清單,其中包含 LaTex 語言定義(語言識別碼和檔案擴充名)、著色 (grammars
) 和程式碼片段。
{
"name": "language-latex",
"description": "LaTex Language Support",
"version": "0.0.1",
"publisher": "someone",
"engines": {
"vscode": "0.10.x"
},
"categories": ["Programming Languages", "Snippets"],
"contributes": {
"languages": [
{
"id": "latex",
"aliases": ["LaTeX", "latex"],
"extensions": [".tex"]
}
],
"grammars": [
{
"language": "latex",
"scopeName": "text.tex.latex",
"path": "./syntaxes/latex.tmLanguage.json"
}
],
"snippets": [
{
"language": "latex",
"path": "./snippets/snippets.json"
}
]
}
}
請注意,擴充功能資訊清單的 categories
屬性現在同時包含 程式語言
和 程式碼片段
,以便在市集中輕鬆探索和篩選。
提示:請確保您合併的貢獻使用相同的識別碼。在上面的範例中,所有三個貢獻都使用 "latex" 作為語言識別碼。這讓 VS Code 知道著色器 (
grammars
) 和程式碼片段適用於 LaTeX 語言,並且在編輯 LaTeX 檔案時將會啟用。
擴充功能包
您可以將個別的擴充功能捆綁在擴充功能包中。擴充功能包是一組將一起安裝的擴充功能。這讓您可以輕鬆地與其他使用者分享您最喜歡的擴充功能,或為特定情境(例如 PHP 開發)建立一組擴充功能,以協助 PHP 開發人員快速開始使用 VS Code。
擴充功能包使用 package.json
檔案內的 extensionPack
屬性來捆綁其他擴充功能。
例如,以下是一個 PHP 的擴充功能包,其中包含偵錯工具和語言服務
{
"extensionPack": ["xdebug.php-debug", "zobo.php-intellisense"]
}
安裝擴充功能包時,VS Code 現在也會安裝其擴充功能相依性。
擴充功能包應在 擴充功能包
市集類別中分類
{
"categories": ["Extension Packs"]
}
若要建立擴充功能包,您可以使用 yo code
Yeoman 產生器,並選擇 New Extension Pack 選項。有一個選項可以使用您目前在 VS Code 執行個體中安裝的擴充功能集來播種套件。這樣一來,您可以輕鬆地使用您最喜歡的擴充功能建立擴充功能包,將其發佈到市集,並與他人分享。
擴充功能包不應與其捆綁的擴充功能有任何功能相依性,並且捆綁的擴充功能應可獨立於套件進行管理。如果擴充功能依賴另一個擴充功能,則應使用 extensionDependencies
屬性宣告該相依性。
擴充功能解除安裝 Hook
如果您的擴充功能在從 VS Code 解除安裝時需要完成一些清理工作,您可以在擴充功能的 package.json 中 scripts
區段下註冊一個 node
腳本到解除安裝 Hook vscode:uninstall
。
{
"scripts": {
"vscode:uninstall": "node ./out/src/lifecycle"
}
}
此腳本會在擴充功能從 VS Code 完全解除安裝時執行,也就是在擴充功能解除安裝後重新啟動 VS Code(關閉並啟動)時執行。
注意:僅支援 Node.js 腳本。
實用的 Node 模組
npmjs 上有幾個 Node.js 模組可用於協助編寫 VS Code 擴充功能。您可以將這些模組包含在擴充功能的 dependencies
區段中。
- vscode-nls - 支援外部化和本地化。
- vscode-uri - VS Code 及其擴充功能使用的 URI 實作。
- jsonc-parser - 一個掃描器和容錯分析器,用於處理帶有或不帶有註解的 JSON。
- request-light - 一個輕量級 Node.js 請求函式庫,具有 Proxy 支援
- vscode-extension-telemetry - VS Code 擴充功能的一致遙測報告。
- vscode-languageclient - 輕鬆整合符合 語言伺服器協定 的語言伺服器。
後續步驟
若要深入瞭解 VS Code 擴充性模型,請嘗試以下主題