Alhagi实现记录
参考资料https://spec.commonmark.org/0.31.2/
CommonMark解析策略先将文档分解为块结构,但不解析文本,链接引用定义可以先收集起来
按行解析
先判断当前行内容是否能加到已有容器中, 从根节点的最后一个子节点A开始,检测当前行的开头元素, 若能匹配,则取该节点A的最后一个子节点B,继续匹配当前行的剩余元素,以此类推,直到已有的最深层容器无法匹配当前行;若不能匹配,则容器指针指向当前容器上一级,并且将当前指针另存为T,用于后期关闭使用
判断当前行剩余内容可以解析成什么块,如果说 解析成了容器块,则说明后面还有叶子块,循环解析,直到解析到叶子块,并将后面所有内容添加到叶子块中
如果没能匹配到任何块,则说明是纯文本内容,有以下几种处理:
判断当前容器是否能包含纯文本
新创建一个段落块
添加到现有段落的懒延续中
关闭:从当前节点开始,向上级关闭,直到关闭到T,(T不关闭,因为下一行可能还要放在这个容器中)
md编辑器相关技术记录
参考资料从零开始写一个富文本编辑器(一) - 掘金 (juejin.cn)
十分钟实现自己的Typora - 掘金 (juejin.cn)
Selection - Web API | MDN (mozilla.org)
Vditor 实现 Markdown 所见即所得 - 链滴 (ld246.com)
关于所见即所得 Markdown 编辑器的讨论 - 链滴 (ld246.com)
剪贴板操作 Clipboard API 教程 - 阮一峰的网络日志 (ruanyifeng.com)
https://spec.commonmark.org/0.31.2
SelectionSelection中存储用户选择的文本范围或者插入符号的位置,获取方式:window.getSelection()
在不可编辑元素中,插入点位置和选区范围必须通过鼠标的点击或者拖拽产生,在可编辑元素中,插入点位置和选取范围也可以通过键盘方向键变化。
可通过window.getSelection().toString()获取被选中的文字
Range可通过selection.getRangeAt获取
Range.commo ...
编辑器LSP服务
参考资料理解 Language Server Protocol 的工作原理 - 掘金 (juejin.cn)
概述LSP为为编辑器提供的工作区内容索引服务,一般具有代码补全,纠错等功能。
基本作用原理在编辑器启动时会同时启动一个进程叫做语言服务,编辑器会将当前用户编辑的位置及相关消息通过进程间通信发送给语言服务进程,语言服务会根据用户当前编辑位置的上下文进行代码补全等处理,并将结果响应给编辑器
优点该协议使得语法补全等功能无需每个语言都要为每个编辑器适配一套,大家都遵循这一协议,每种语言只需要在该协议上提供服务,而每种编辑器只需要实现LSP的客户端与服务端即可。