擴充套件清單

每個 Visual Studio Code 擴充套件在其擴充套件目錄結構的根目錄下都需要一個清單檔案 package.json。

欄位

另請檢視 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"
}

Marketplace 展示技巧

以下是一些提示和建議，可讓您的擴充套件在 VS Code Marketplace 上展示時看起來很棒。

始終使用最新的 vsce，因此請使用 npm install -g @vscode/vsce 以確保您已安裝它。

在擴充套件的根資料夾中有一個 README.md Markdown 檔案，我們會將內容包含在擴充套件詳細資訊的主體中（在 Marketplace 上）。您可以在 README.md 中提供相對路徑影像連結。

以下是一些示例

1. 字數統計
2. MD 工具

提供一個好的顯示名稱和描述。這對於 Marketplace 和產品展示很重要。這些字串也用於 VS Code 中的文字搜尋，擁有相關的關鍵字將會有很大幫助。

    "displayName": "Word Count",
    "description": "Markdown Word Count Example - reports out the number of words in a Markdown file.",

圖示和對比鮮明的橫幅顏色在 Marketplace 頁面標題上看起來很棒。theme 屬性指的是橫幅中使用的字型 - dark 或 light。

{
  "icon": "images/icon.png",
  "galleryBanner": {
    "color": "#C80000",
    "theme": "dark"
  }
}

您可以設定幾個可選連結（bugs、homepage、repository），它們顯示在 Marketplace 的資源部分下。

{
  "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"
  }
}

為您的擴充套件設定一個 category。同一 category 中的擴充套件在 Marketplace 上會分組在一起，這可以改善篩選和發現。

注意： 只使用對您的擴充套件有意義的值。允許的值是 [Programming Languages, Snippets, Linters, Themes, Debuggers, Formatters, Keymaps, SCM Providers, Other, Extension Packs, Language Packs, Data Science, Machine Learning, Visualization, Notebooks, Education, Testing]。對於語法高亮和程式碼補全等通用語言功能，請使用 Programming Languages。Language Packs 類別保留用於顯示語言擴充套件（例如，本地化的保加利亞語）。

{
  "categories": ["Linters", "Programming Languages", "Other"]
}

批准的徽章

由於安全原因，我們只允許來自受信任服務的徽章。

我們允許來自以下 URL 字首的徽章

• api.travis-ci.com
• app.fossa.io
• badge.buildkite.com
• badge.fury.io
• badgen.net
• badges.frapsoft.com
• badges.gitter.im
• cdn.travis-ci.com
• 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
• 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
• visualstudio.com
• vsmarketplacebadges.dev

注意：請將 vsmarketplacebadge.apphb.com 徽章替換為 vsmarketplacebadges.dev 徽章。

如果您有其他想使用的徽章，請在 GitHub 上開啟一個問題，我們很樂意檢視。

組合擴充套件貢獻

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 屬性現在同時包含 Programming Languages 和 Snippets，以便在 Marketplace 上輕鬆發現和篩選。

提示： 確保您合併的貢獻使用相同的識別符號。在上面的示例中，所有三個貢獻都使用“latex”作為語言識別符號。這讓 VS Code 知道著色器（grammars）和程式碼片段適用於 LaTeX 語言，並且在編輯 LaTeX 檔案時將處於活動狀態。

擴充套件包

您可以將單獨的擴充套件捆綁到擴充套件包中。擴充套件包是一組將一起安裝的擴充套件。這使得與他人輕鬆共享您喜歡的擴充套件或為特定場景（如 PHP 開發）建立一組擴充套件成為可能，以幫助 PHP 開發人員快速開始使用 VS Code。

擴充套件包使用 package.json 檔案中的 extensionPack 屬性捆綁其他擴充套件。

例如，這是一個用於 PHP 的擴充套件包，其中包括偵錯程式和語言服務

{
  "extensionPack": ["xdebug.php-debug", "zobo.php-intellisense"]
}

安裝擴充套件包時，VS Code 現在還會安裝其擴充套件依賴項。

擴充套件包應歸類到 Extension Packs Marketplace 類別中

{
  "categories": ["Extension Packs"]
}

要建立擴充套件包，您可以使用 yo code Yeoman 生成器並選擇新建擴充套件包選項。有一個選項可以使用您當前在 VS Code 例項中安裝的擴充套件集來初始化該包。透過這種方式，您可以輕鬆地使用您喜歡的擴充套件建立擴充套件包，將其釋出到 Marketplace，並與他人共享。

擴充套件包不應與其捆綁的擴充套件有任何功能依賴關係，並且捆綁的擴充套件應獨立於該包進行管理。如果一個擴充套件依賴於另一個擴充套件，則應使用 extensionDependencies 屬性宣告該依賴關係。

擴充套件解除安裝鉤子

如果您的擴充套件在從 VS Code 解除安裝時需要進行一些清理工作，您可以在擴充套件的 package.json 的 scripts 部分下，將一個 node 指令碼註冊到解除安裝鉤子 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 請求庫
• vscode-extension-telemetry - 用於 VS Code 擴充套件的一致遙測報告。
• vscode-languageclient - 輕鬆整合遵循語言伺服器協議的語言伺服器。

後續步驟

要了解有關 VS Code 可擴充套件性模型的更多資訊，請嘗試以下主題

• 貢獻點 - VS Code 貢獻點參考
• 啟用事件 - VS Code 啟用事件參考
• 擴充套件市場 - 閱讀更多關於 VS Code 擴充套件市場的資訊