VS Code插件开发教程(3) 插件能力一览 Capabilities

通用能力(Common Capabilities)

在任何插件中,通用能力都是核心功能,通用能力包括但不限于:git

  • 注册命令,配置,快捷键,上下文菜单
  • 存储工做区或全局的数据
  • 展现提示信息
  • Quick Pick收集用户输入
  • 调用本地文件选择器以便用户选择文件
  • 利用Progress API为用户展现长时间运行的操做进度

通用能力主要有如下几种:github

  • 命令(Command):命令在VS Code的运转中扮演极为重要的角色。你会经过Command Palette、绑定快捷键或者右键菜单来执行命令,而对于一个插件来讲,应该作到下面这两点:web

  • 配置(Configuration):一个插件若是须要用户配置(这是很常见的),那么能够经过 contributes.configuration 实现插件配置项的声明(contributes.configuration定义了该插件的配置字段以及默认值等信息,用户能够实现工做区配置或全局配置,能够参考 ESLint插件的配置 ),而后经过 workspace.getConfiguration 接口实现获取用户实际的配置值编程

  • 快捷键(Keybinding):一个插件能够添加自定义快捷键,详见 contributes.keybindingsjson

  • 上下文菜单(Context Menu):插件能够添加自定义上线文菜单项,详见 contributes.menusapi

  • 数据存储(Data Storage):有4种数据存储的方式(注:extension context在入口文件的activate函数中可用,是该函数的第一个参数)服务器

    • ExtensionContext.workspaceState:工做空间(workspace)域,以键值对方式存储,由VS Code负责管理。当工做空间再次被打开时,存储的数据会被恢复。
    • ExtensionContext.globalState:全局域,以键值对方式存储,由VS Code负责管理。当任何一个插件被激活时,,存储的数据会被恢复。插件能够同步的读取到键值对数据而且经过setKeysForSync方法异步的赋值
    • ExtensionContext.storagePath:工做空间(workspace)域,能够为一个工做空间指定一个存储路径(一个本地的目录),当咱们须要给一个工做空间存储较大的数据时(例如文件),该功能很是有用
    • ExtensionContext.globalStoragePath:全局域,能够为全局空间指定一个存储路径(一个本地的目录),当咱们须要在不一样的插件之间共用大的数据时(例如文件),该功能很是有用
  • 展现通知(Display Notifications):几乎全部的插件都会用到通知功能,VS Code提供了3个API用于不一样级别的通知:markdown

  • 快速选择(Quick Pick):经过 vscode.QuickPick API ,提供给用户一些选项去选择,开发者能够很容易的获取到用户的选择,能够经过该 QuickInput Sample 示例学习相关API的用法app

  • 文件选择(File Picker):经过 vscode.window.showOpenDialog 接口可让用户选择本地的文件异步

  • 输出通道(Output Channel):输出面板(Output Panel)是一系列 OutputChannel 的集合,能够经过 window.createOutputChannel 实现

  • 进度(Progress):能够经过 vscode.Progress 接口将进度展现给用户,同时能够经过 ProgressLocation方法指定显示的位置 咱们能够经过这个示例来学习

主题(Theming)

主题影响VS Code的外观,包括VS Code以及编辑器中代码的配色,咱们能够借助该特性作如下事情:

  • 改变编辑区代码的配色
  • 改变VS Code界面的配色
  • 增长自定义文件图标

VS Code中,有三种类型的主题:

  • 颜色主题(Color Theme):UI组件的颜色以及文本字符的颜色,建立主颜色主题的方法能够参见 Color Theme Guide ,还能够参考这个示例 Color Theme Sample

    • colors:标记了UI组件的控制色
    • tokenColors:标记了编辑区域的颜色和样式,详见 Syntax Highlight Guide 获取更多信息
    • semanticTokenColors:编辑区域高亮的增强版,详见 Semantic Highlight Guide
  • 文件图标主题:将文件类型、名称对应为指定的图标(图片),File Icon Theme Guide 有对如何建立文件图标主题的详细介绍

  • 产品图标主题:用在UI、Side barActivity barstatus bar等处的图标,Product Icon Theme Guide 详细介绍了如何建立产品图标主题

声明式语言特性(Declarative Language Features)

Declarative Language Features 包含了基本的编程语言文本编辑能力,好比小括号匹配、自动缩进以及语法高亮。这些都是采用声明式(declaratively)来实现,不用编写任何代码。不过声明语言特性不支持语法提示以及debug之类的高级特性。咱们能够借助该特性作如下事情:

  • 给一个插件绑定通用JavaScript语法片断(snippets)
  • 告知VS Code一种新的编程语言
  • 增添或替换一种编程语言的语法
  • 经过grammar injection拓展已经存在的语法

编程式语言特性(Programmatic Language Features)

Programmatic language features 提供了更加丰富的语言功能,例如Hovers、跳转到定义、错误诊断、智能感知、CodeLens(参考文章)。这些特性均可以经过调用 vscode.languages.*接口实现,不过也能够经过编写Language Server来实现。咱们能够借助编程式语言特性(Programmatic Language Features)作如下事情:

  • 经过悬浮来展现一个API的用法
  • 经过错误诊断来报告源码中的拼写错误
  • 注册一个新的HTML式化工具
  • 提供一个强大的、上下文感知的智能提示器
  • 给一个语言提供折叠、面包屑功能

工做台拓展(Workbench Extensions)

Workbench Extensions 能够用来扩展VS Code的工做台,还能够拓展鼠标右键,甚至经过VS CodeTreeView API 创建一个自定义explorer(若是想要一个更加自定义的用户界面,能够经过 Webview API)。咱们能够借助工做台拓展(Workbench Extensions)作如下事情:

  • 在文件浏览菜单增长一个自定义上下文菜单行为
  • 在侧边栏(Side Bar)增长新的、可交互的树视图(TreeView
  • 定义一个新的Activity Bar视图
  • Status Bar显示新的信息
  • 经过 Webview API 实现自定义内容渲染

VS Code提供了一系列的API帮助开发者在WorkbenchTitle BarActivity BarSide BarPanelEditor GroupStatus Bar)里添加本身的组件,例如:

  • Activity BarAzure App Service 插件增长了一个View Container
  • Side Bar:内置的 NPM 插件增长了一个Tree View
  • Editor Group:内置的 Markdown 插件增长了一个 Webview
  • Status Bar:VSCodeVim 插件增长了一个 Status Bar Item(能够用文字或图标来展现,而且在点击的时候执行命令, Status Bar的应用示例能够参见 statusbar-sample

调试(Debugging)

你能够利用VS CodeDebugging 功能编写Debugger Extension,将VS Code的调试界面用于实现某种debugger。咱们能够借助该特性作如下事情:

  • 经过 Debug Adapter implementationVS Code的调试UI和一个调试器连接
  • 新增对某一种语言的调试支持
  • 提供调试配置信息的自动补全

另外一方面,VS Code提供了一系列 Debug Extension API ,能够用来实现调试的自动化,咱们能够借助该特性作如下事情:

  • 经过动态的调试配置来启动调试任务
  • 跟踪调试任务的生命周期
  • 以编程的方式建立和管理断点

拓展原则(Extension Guidelines)

为了帮助开发者编写合乎VS Code风格的插件,VS Code提供 Extension Guidelines 来帮助开发者学会VS Code插件的最佳开发实践

限制(Restrictions)

插件没法访问到VS Code界面的DOM,无法经过编写本身的CSS或HTML来改变VS Code的界面,VS Code经过Extension Host 进程来管理插件,杜绝插件对界面的篡改以及可能的性能与稳定性影响。

相关文章

相关文章
相关标签/搜索