跳到正文
QuireKit Markdown
开发者文档
预览版 · 未发布
扩展与渲染查看 Markdown ↗

自定义语法与节点

为业务语法增加解析和阅读显示,以待办状态标记为例。

如果你希望 [[done]] 显示成“已完成”,需要解决两件事:识别这段语法并读出状态值,再把状态显示出来。解析扩展负责前者,阅读贡献负责后者。

1. 复用解析扩展

已有 MSFE Node / Mark 可直接通过 options.extensions 安装。 withMarkdownReading(extension, { render, load?, cacheKey? }) 给同一个 source codec 添加阅读能力: 字段继续经过 addAttributes 的默认值和校验,非法值或未闭合语法保留原文。先完成 extension 的 configure/extend,再包装阅读贡献。

2. 为状态值提供显示

示例的 status/reading.ts 将 Status 交给 withMarkdownReading(),根据 attrs.value 返回“待办”或“已完成”。读者看到的是标签,保存的仍是 [[todo]] 或 [[done]]。

下面使用 [[todo]] / [[done]] 语法,同时替换链接并开启 HTML。 点击逐字追加,可以观察未闭合节点、HTML 和后置引用的更新。

正在准备示例…

完整示例按文件查阅:status/status.ts 定义语法和字段;status/types.ts 定义状态值类型;status/reading.ts 定义阅读外观;reading/custom.vue 负责将这些配置传给阅读器。链接替换由独立的 reading/link.vue 负责,见替换渲染组件。

3. 处理子内容与异步资源

render 获得只读 document、node、attrs、locale,以及有范围校验的 renderInline() / renderBlocks()。自定义块可以递归呈现其已解析子节点。 load(context, signal) 可返回 { value, release? } 或相应 Promise;更换快照、消息或卸载 会取消旧任务,迟到结果也会释放;满足缓存依赖合同时,未改变的块保留资源。 渲染、读取、加载失败通过 error 事件上报并保留该节点源码。

更复杂的语法

复杂语法可用 options.syntax 安装原生 Lezer MarkdownExtension(包括块与行内 parser), 再由 source codec 解释字段。仅做只读投影时也可用 renderNode(context, node) 处理命名 语法节点,未处理时返回 undefined 交给内置分派。节点的 grammar 与字段归解析扩展, 外观归阅读贡献;不对最终 HTML 字符串做正则替换。

QuireKit Markdown · QuireKit流式 Markdown · @quirekit/incremark · MIT