扩展工作台
“工作台”指的是 Visual Studio Code 的整体 UI,包含以下 UI 组件
- 标题栏
- 活动栏
- 侧边栏
- 面板
- 编辑器组
- 状态栏
VS Code 提供了各种 API,允许您向工作台添加自己的组件。例如,在下面的图片中

- 活动栏:Azure App Service 扩展 添加了一个 视图容器
- 侧边栏:内置的 NPM 扩展 在资源管理器视图中添加了一个 树视图
- 编辑器组:内置的 Markdown 扩展 在编辑器组中的其他编辑器旁边添加了一个 Webview
- 状态栏:VSCodeVim 扩展 在状态栏中添加了一个 状态栏项目
视图容器
通过 contributes.viewsContainers 贡献点,您可以添加新的视图容器,它们将显示在五个内置视图容器旁边。请在 树视图 主题中了解更多信息。
树视图
通过 contributes.views 贡献点,您可以添加新的视图,它们将显示在任何视图容器中。请在 树视图 主题中了解更多信息。
Webview
Webviews 是使用 HTML/CSS/JavaScript 构建的高度可定制的视图。它们显示在编辑器组区域中的文本编辑器旁边。请在 Webview 指南 中了解更多关于 Webview 的信息。
状态栏项目
扩展可以创建自定义 StatusBarItem,在状态栏中显示。状态栏项目可以显示文本和图标,并在点击事件上运行命令。
- 显示文本和图标
- 点击时运行命令
您可以参考 状态栏扩展示例 了解更多信息。