扩展功能概述

Visual Studio Code 为扩展提供了多种扩展其功能的方法。有时很难找到合适的贡献点 (Contribution Points)VS Code API。本主题将扩展功能分为几个类别。每个类别都描述了:

  • 你的扩展可以使用的一些功能
  • 指向使用这些功能的更详细主题的链接
  • 一些扩展思路

然而,我们也会对扩展施加限制,以确保 VS Code 的稳定性和性能。例如,扩展无法访问 VS Code UI 的 DOM。

常用功能

常用功能是可以在任何扩展中使用的核心功能组件。

其中一些功能包括:

  • 注册命令、配置、快捷键或上下文菜单项。
  • 存储工作区或全局数据。
  • 显示通知消息。
  • 使用 Quick Pick 收集用户输入。
  • 打开系统文件选择器,让用户选择文件或文件夹。
  • 使用 Progress API 指示长时间运行的操作。

主题

主题 (Theming) 可控制 VS Code 的外观,包括编辑器中源代码的颜色以及 VS Code UI 的颜色。如果你曾经想过通过将 VS Code 设置为不同深浅的绿色来模拟《黑客帝国》的编程效果,或者仅仅是想创建一个极致简约的灰度工作区,那么主题正是为你准备的。

扩展思路

  • 更改源代码的颜色。
  • 更改 VS Code UI 的颜色。
  • 将现有的 TextMate 主题移植到 VS Code。
  • 添加自定义文件图标。

声明式语言功能

声明式语言功能为编程语言添加了基本的文本编辑支持,例如括号匹配、自动缩进和语法高亮。这是通过声明方式完成的,无需编写任何代码。有关更高级的语言功能(如智能感知或调试),请参阅程序化语言功能

扩展思路

  • 将常见的 JavaScript 代码片段打包到扩展中。
  • 向 VS Code 告知一种新的编程语言。
  • 添加或替换编程语言的语法定义。
  • 通过语法注入扩展现有语法。
  • 将现有的 TextMate 语法移植到 VS Code。

程序化语言功能

程序化语言功能增加了丰富的编程语言支持,例如悬停提示、跳转到定义、诊断错误、智能感知 (IntelliSense) 和代码透镜 (CodeLens)。这些语言功能通过 vscode.languages.* API 公开。扩展可以直接使用这些 API,或者编写一个语言服务器,并使用 VS Code 语言服务器库将其适配到 VS Code。

尽管我们提供了语言功能及其预期用法的列表,但没有任何东西能阻止你创造性地使用这些 API。例如,CodeLens 和悬停提示是展示内联附加信息的绝佳方式,而诊断错误可用于突出显示拼写或代码风格错误。

扩展思路

  • 添加显示 API 示例用法的悬停提示。
  • 使用诊断功能报告源代码中的拼写或 Linter 错误。
  • 为 HTML 注册一个新的代码格式化程序。
  • 提供丰富的、上下文感知的智能感知。
  • 为语言添加折叠、面包屑和轮廓支持。

工作台扩展 (Workbench Extensions)

工作台扩展可以扩展 VS Code 工作台 UI。你可以向文件资源管理器添加新的右键点击操作,甚至可以使用 VS Code 的 TreeView API 构建自定义资源管理器。如果你的扩展需要完全自定义的用户界面,可以使用 Webview API,通过标准 HTML、CSS 和 JavaScript 构建你自己的文档预览或 UI。

扩展思路

  • 向文件资源管理器添加自定义上下文菜单操作。
  • 在侧边栏中创建一个新的交互式 TreeView。
  • 定义一个新的活动栏视图。
  • 在状态栏中显示新信息。
  • 使用 WebView API 渲染自定义内容。
  • 贡献源代码管理提供程序。

调试

你可以通过编写连接 VS Code 调试 UI 与特定调试器或运行时的调试器扩展,来利用 VS Code 的调试功能。

扩展思路

  • 通过贡献调试适配器实现,将 VS Code 的调试 UI 连接到调试器或运行时。
  • 指定调试器扩展支持的语言。
  • 为调试器使用的调试配置属性提供丰富的智能感知和悬停信息。
  • 提供调试配置代码片段。

另一方面,VS Code 还提供了一套调试扩展 API,你可以利用它在任何 VS Code 调试器之上实现与调试相关的功能,从而自动化用户的调试体验。

扩展思路

  • 基于动态创建的调试配置启动调试会话。
  • 跟踪调试会话的生命周期。
  • 以编程方式创建和管理断点。

用户体验指南

为了帮助你的扩展无缝融入 VS Code 用户界面,请参阅用户体验指南 (UX Guidelines),你将在其中学习创建扩展 UI 的最佳实践以及遵循首选 VS Code 工作流程的约定。

限制

我们对扩展施加了某些限制。以下是这些限制及其目的。

禁止访问 DOM

扩展无法访问 VS Code UI 的 DOM。你不能编写一个将自定义 CSS 应用于 VS Code 或向 VS Code UI 添加 HTML 元素的扩展。

在 VS Code 中,我们不断尝试优化底层 Web 技术的使用,以提供一个始终可用、响应迅速的编辑器;随着这些技术和我们产品的发展,我们将继续调整对 DOM 的使用。为确保扩展不会干扰 VS Code 的稳定性和性能,并确保我们能够在不破坏现有扩展的情况下持续改进 VS Code 的 DOM,我们在扩展主机进程中运行扩展,并防止其直接访问 DOM。

禁止自定义样式表

用户或扩展提供的自定义样式表可能会破坏 DOM 结构和类名。我们并未将这些文档化,因为我们将其视为内部实现。为了发展、重构或改进 VS Code,我们需要自由地更改用户界面。任何对 DOM 的更改都可能破坏现有的自定义样式表,从而给样式表提供者带来挫败感,并因破碎的样式表导致 UI 故障,造成糟糕的用户体验。

相反,VS Code 旨在提供设计良好的扩展 API 以支持 UI 自定义。该 API 有文档说明,附带工具和示例,并在所有即将发布的 VS Code 版本中保持稳定。

© . This site is unofficial and not affiliated with Microsoft.