编写第一个vscode插件,扩展非代码文件格式

vscode 本质上是一个编辑器

作为编辑器本职的工作是编辑文件,选中一个文件,打开对应的编辑器。


我们接触的最多的是vscode的文本编辑模式,对于这种模式,vscode称为代码编辑器,代码编辑器也有扩展方法


今天来说说另一个非文本化的编辑器如何扩展,我们之前研究了webview,但是要自己打开。

vscode提供了一个自定义编辑器的扩展方法,和文件扩展名绑定

image

如图


image

然后只需要注册一个自定义编辑器事件,以后扩展名为pal的文件,就会自动打开我们的编辑器


image

此处涉及的代码比较多,我把他分成四个部分来说明


1.呈现webview,这里webview已经被创建好了,我们只需要改变属性

image


2.处理文档变化事件,因为文档有可能在webview之外被改变,比如用其它的编辑器改了,就需要及时同步给webview

image


3.处理webview事件

webview是我们自定义的编辑器,他的事件就是要修改文件了

image

此处我们比较暴力,无论收到了啥,就全文替换写进文档里。这里并没有直接写入,而是用了vscode标准的edit操作

image

执行该操作后,文件上的小点点会亮起,处于未保存状态,此时继续保存,才会写入文件。


4.把文件内容发给webview,这是第一次打开编辑器时的初始化操作,同2


虽然代码稍多

如果你要编辑的文件是文本格式,这个扩展还是很简单的。


代码见


ttplugin03 · lights li/vscodeext - 码云 - 开源中国 (gitee.com)



如果你要扩展二进制文件编辑的时候,这个扩展就更复杂一点,

需要继承两个类,继承CustomDocment 实现一个自己的文档对象

继承CustomDocmentProvider

posted @ 2022-05-13 10:45  疯光无线  阅读(161)  评论(0编辑  收藏  举报