vscode插件快餐教程(8) - LSP文本同步

简介: 这一节开始我们介绍下通过LSP进行文本同步的方法。

vscode插件快餐教程(8) - LSP文本同步

这一节开始我们介绍下通过LSP进行文本同步的方法。

文件打开

我们先从简单的做起,先监听文件的打开。
我们看一下LSP协议中对此部分的支持,参数是DidChangeTextDocumentParams结构。
LSP_

微软的SDK在LSP的基础上是做了封装的,我们看下封装后的接口:
_API

当前,TextDocument提供了4个属性:

  • uri: 文件的URI
  • version: 文件的版本号
  • languageId: 编程语言
  • lineCount: 有多少行
    另外还有3个函数:
  • getText(): 获取文本
  • positionAt和offsetAt用于Position和offset的转换

我们来看个例子:

documents.onDidOpen(
    (event: TextDocumentChangeEvent) => {
        logger.debug(`on open:${event.document.uri}`);
        logger.debug(`file version:${event.document.version}`);
        logger.debug(`file content:${event.document.getText()}`);
        logger.debug(`language id:${event.document.languageId}`);
        logger.debug(`line count:${event.document.lineCount}`);
    }
);

我们来看一个运行的例子:

[2019-06-04T18:11:31.999] [DEBUG] lsp_demo - on open:file:///Users/ziyingliuziying/test.vb
[2019-06-04T18:11:31.999] [DEBUG] lsp_demo - file version:1
[2019-06-04T18:11:31.999] [DEBUG] lsp_demo - file content:dim a as integer;
TextView1
Javascript
Button3
Test2

[2019-06-04T18:11:31.999] [DEBUG] lsp_demo - language id:vb
[2019-06-04T18:11:32.000] [DEBUG] lsp_demo - line count:6

监听文件变化

监听文件变化与监听打开文件基本上是一模一样的,代码如下:

documents.onDidChangeContent(
    (e: TextDocumentChangeEvent) => {
        logger.debug('document change received.');
        logger.debug(`document version:${e.document.version}`);
        logger.debug(`text:${e.document.getText()}`);
        logger.debug(`language id:${e.document.languageId}`);
        logger.debug(`line count:${e.document.lineCount}`);
    }
);
[2019-06-04T18:30:34.329] [DEBUG] lsp_demo - document change received.
[2019-06-04T18:30:34.329] [DEBUG] lsp_demo - document version:1
[2019-06-04T18:30:34.329] [DEBUG] lsp_demo - text:dim a as integer;
TextView1
Javascript
Button3
Test2

[2019-06-04T18:30:34.329] [DEBUG] lsp_demo - language id:vb
[2019-06-04T18:30:34.329] [DEBUG] lsp_demo - line count:6

[2019-06-04T18:30:39.457] [DEBUG] lsp_demo - document change received.
[2019-06-04T18:30:39.457] [DEBUG] lsp_demo - document version:2
[2019-06-04T18:30:39.457] [DEBUG] lsp_demo - text:

[2019-06-04T18:30:39.457] [DEBUG] lsp_demo - language id:vb
[2019-06-04T18:30:39.458] [DEBUG] lsp_demo - line count:2

[2019-06-04T18:30:41.576] [DEBUG] lsp_demo - document change received.
[2019-06-04T18:30:41.576] [DEBUG] lsp_demo - document version:3
[2019-06-04T18:30:41.577] [DEBUG] lsp_demo - text:b
[2019-06-04T18:30:41.577] [DEBUG] lsp_demo - language id:vb
[2019-06-04T18:30:41.577] [DEBUG] lsp_demo - line count:1

[2019-06-04T18:30:41.949] [DEBUG] lsp_demo - document change received.
[2019-06-04T18:30:41.949] [DEBUG] lsp_demo - document version:4
[2019-06-04T18:30:41.949] [DEBUG] lsp_demo - text:u
[2019-06-04T18:30:41.949] [DEBUG] lsp_demo - language id:vb
[2019-06-04T18:30:41.949] [DEBUG] lsp_demo - line count:1

[2019-06-04T18:30:42.447] [DEBUG] lsp_demo - document change received.
[2019-06-04T18:30:42.447] [DEBUG] lsp_demo - document version:5
[2019-06-04T18:30:42.447] [DEBUG] lsp_demo - text:Button5
[2019-06-04T18:30:42.447] [DEBUG] lsp_demo - language id:vb
[2019-06-04T18:30:42.447] [DEBUG] lsp_demo - line count:1

文本监听模式

上面的监听方式是增量监听,使用TextDocumentSyncKind.Incremental模式,代码如下:

connection.onInitialize((params: InitializeParams) => {
    return {
        capabilities: {
            textDocumentSync: {
                openClose: true,
                change: TextDocumentSyncKind.Incremental
            },
            completionProvider: {
                resolveProvider: true
            }
        }
    };
});

增量模式是每次只传变化的部分。
下面我们可以看看传全量模式与其的区别:

connection.onInitialize((params: InitializeParams) => {
    return {
        capabilities: {
            textDocumentSync: {
                openClose: true,
                change: TextDocumentSyncKind.Full
            },
            completionProvider: {
                resolveProvider: true
            }
        }
    };
});

全量模式下,每次变化后的全量都会通过消息传递过来,我们看个例子:

[2019-06-04T19:52:12.305] [DEBUG] lsp_demo - document change received.
[2019-06-04T19:52:12.305] [DEBUG] lsp_demo - document version:1
[2019-06-04T19:52:12.305] [DEBUG] lsp_demo - text:dim a as integer;
TextView1
Javascript
Button3
Test2
Button5

[2019-06-04T19:52:12.305] [DEBUG] lsp_demo - language id:vb
[2019-06-04T19:52:12.305] [DEBUG] lsp_demo - line count:7
[2019-06-04T19:52:19.442] [DEBUG] lsp_demo - document change received.
[2019-06-04T19:52:19.442] [DEBUG] lsp_demo - document version:2
[2019-06-04T19:52:19.442] [DEBUG] lsp_demo - text:dim a as integer;
TextView1
Javascript
Button3
Test2
Button5
T
[2019-06-04T19:52:19.443] [DEBUG] lsp_demo - language id:vb
[2019-06-04T19:52:19.443] [DEBUG] lsp_demo - line count:7
[2019-06-04T19:52:19.443] [DEBUG] lsp_demo - onCompletion
[2019-06-04T19:52:19.787] [DEBUG] lsp_demo - document change received.
[2019-06-04T19:52:19.787] [DEBUG] lsp_demo - document version:5
[2019-06-04T19:52:19.787] [DEBUG] lsp_demo - text:dim a as integer;
TextView1
Javascript
Button3
Test2
Button5
Test
[2019-06-04T19:52:19.787] [DEBUG] lsp_demo - language id:vb
[2019-06-04T19:52:19.787] [DEBUG] lsp_demo - line count:7
[2019-06-04T19:52:19.788] [DEBUG] lsp_demo - onCompletion
[2019-06-04T19:52:21.877] [DEBUG] lsp_demo - document change received.
[2019-06-04T19:52:21.877] [DEBUG] lsp_demo - document version:6
[2019-06-04T19:52:21.877] [DEBUG] lsp_demo - text:dim a as integer;
TextView1
Javascript
Button3
Test2
Button5
Test

[2019-06-04T19:52:21.877] [DEBUG] lsp_demo - language id:vb
[2019-06-04T19:52:21.877] [DEBUG] lsp_demo - line count:8

还可以选择TextDocumentSyncKind.None模式,这时候不同步文本信息。

目录
相关文章
|
搜索推荐 C++ 开发者
VSCode安装使用教程,保姆级!
本文介绍了Visual Studio Code(VS Code)的安装和基本使用,包括从官网下载安装包,按照步骤在Windows系统上安装,以及设置个性化主题。此外,还强调了安装插件以增强功能,例如安装简体中文插件,并展示了如何搜索和安装插件。VS Code作为一个免费、开源的轻量级编辑器,其丰富的扩展性和高效性使其成为开发者工具的首选。
|
6月前
|
人工智能 自然语言处理 Java
DeepSeek 满血版在 VScode 和 IDEA 中怎么用?手把手教程来了
沉默王二分享了通义灵码的使用教程,这款插件集成了DeepSeek-R1和Qwen等模型,支持Java、Python、Go等多种编程语言,适用于IDEA、VSCode等开发环境。它不仅能提供智能问答、代码补全和Bug修复功能,还能通过“AI程序员”实现多文件代码修改。体验流畅,算力充足,无需担心限流问题。文章详细介绍了安装步骤及各项功能的实际操作,展示了其在提升开发效率方面的强大实力。目前,通义灵码正持续优化,未来将带来更多惊喜。
956 2
|
7月前
|
人工智能 网络安全 开发工具
vscode代码推送到github库菜鸡专用教程
vscode代码推送到github库菜鸡专用教程
|
10月前
|
前端开发 搜索推荐 C++
Marp 教程:如何在 VSCode 中引入自定义样式和主题
本文介绍了如何在 Marp 中引入自定义样式和主题,使你的幻灯片更加个性化和独特。首先,你需要安装 VSCode 和 Marp 插件,了解 Marp 的基本结构。接着,通过创建自定义 CSS 文件并在 Markdown 文件中引入,实现样式定制。此外,还可以创建和使用自定义主题,以及进行高级自定义,如调整布局、引入自定义字体和定义复杂动画。最后,使用 Marp 的预览功能实时查看效果。
970 0
|
10月前
|
前端开发 C++
Marp 教程:使用 VSCode 编写专业 PPT
Marp 是一款基于 Markdown 的幻灯片制作工具,结合 VSCode 的强大编辑功能,可让你高效地创建专业 PPT。本教程将指导你如何在 VSCode 中安装 Marp 插件、配置主题和样式,并使用 Markdown 语法创建和美化幻灯片。内容包括基本结构、布局、图片与图表插入、表格制作,以及高级功能如动画效果、数学公式和代码高亮。最后,你将学会如何预览和导出幻灯片。
1192 0
|
JavaScript 前端开发 编译器
TypeScript教程(一)在vscode中的配置TypeScript环境
本文是一篇TypeScript入门教程,介绍了在VS Code中配置TypeScript环境的步骤,包括安装Node.js、使用npm安装TypeScript、配置npm镜像源、安装VS Code的TypeScript扩展,以及创建和运行一个简单的TypeScript "Hello World"程序。
TypeScript教程(一)在vscode中的配置TypeScript环境
|
编译器 C语言 C++
VSCode安装配置C语言(保姆级教程)
VSCode安装配置C语言(保姆级教程)
|
Linux C语言 C++
vsCode远程执行c和c++代码并操控linux服务器完整教程
这篇文章提供了一个完整的教程,介绍如何在Visual Studio Code中配置和使用插件来远程执行C和C++代码,并操控Linux服务器,包括安装VSCode、安装插件、配置插件、配置编译工具、升级glibc和编写代码进行调试的步骤。
2284 0
vsCode远程执行c和c++代码并操控linux服务器完整教程
vscode 生成项目目录结构 directory-tree 实用教程
vscode 生成项目目录结构 directory-tree 实用教程
1310 2
|
前端开发
VSCode中自带插件Emmet的用法
Emmet 是一个强大的工具,集成在 Visual Studio Code (VSCode) 中,可以大大提高编写 HTML 和 CSS 的效率。以下是如何使用 Emmet 插件的一些基本方法
204 4