资讯详情

资讯详情

cherry-markdown 版本演进全解析:从 0.5 到 0.11 的核心能力、构建体系与安全演进

前端UI组件富文本【免费下载链接】cherry-markdown✨ A Markdown Editor项目地址https://gitcode.com/GitHub_Trending/ch/cherry-markdown点击查看免费下载cherry-markdown 是一款基于 Web 的 Markdown 编辑器本文以仓库内 packages/cherry-markdown/CHANGELOG.md 为主线系统梳理从 v0.5.13 到 v0.11.10 的完整版本演进脉络涵盖编辑器内核升级CodeMirror 6、流式输出stream/AI 会话、所见即所得编辑、主题系统重构、构建产物体系、语法扩展与安全加固等关键议题。读完本文你将能理解 cherry-markdown 每个大版本背后的设计取舍、核心配置项的含义与默认值并知道如何在仓库源码与测试中进一步验证这些能力。版本总览三大演进阶段cherry-markdown 的版本历程可以划分为三个清晰阶段阶段版本区间主题基础成型期v0.5.13 – v0.8.x语法引擎、工具栏、所见即所得WYSIWYG、国际化、多端插件能力爆发期v0.9.0 – v0.10.3流式会话适配、Suggester 联想、图表/公式/mermaid 增强、主题 CSS 变量化内核重构期v0.11.xCodeMirror v6 升级、构建链迁移Vite、ESM/UMD 产物拆分、搜索替换面板其中v0.11.0与v0.11.10是两个技术含量最高的里程碑前者完成了编辑器底层从 CodeMirror 5 到 CodeMirror 6 的重构后者将发布构建链整体迁移至 Vite 并引入 Oxc 压缩器。v0.11.x内核重构与构建体系现代化0.11.0——CodeMirror v6 升级本阶段最重要的破坏性变更v0.11.0 将编辑器内核从 CodeMirror v5 升级到 v6并重构出 CM6Adapter 适配器。这次升级带来几项关键收益与代价性能优化特殊字符标记Decoration/Mark处理性能得到优化对超大文档渲染有直接帮助功能修复修复了选区映射、正则处理、Bubble 事件等一批与编辑器交互相关的历史问题vim 模式懒加载支持通过replit/codemirror-vim实现 vim 编辑模式的按需加载而非随主包打包stream 模式瘦身codeMirror模块改为依赖注入方式加载stream流式模式下完全不加载 CodeMirror进一步降低 AI 会话场景的包体。从源码看Editor.js 中暴露了CM6Adapter、ReplacementWidget与Editor三个类适配器模式正是这一阶段重构的核心产物而 packages/cherry-markdown/test/codemirror/ 目录下的Editor.spec.ts、BatchMarks.spec.ts、MultiInstanceIsolation.spec.ts、SearchReplace.spec.ts等测试文件则是这次重构配套建立的验证体系。升级提醒v0.11.0 同步修复了 XSS 安全漏洞#1653并调整了工具栏隐藏逻辑——当toolbar与toolbarRight同时为false或空数组时顶部工具栏将自动隐藏。0.11.4——内置搜索/替换面板与动态安装 mermaidv0.11.4 引入两个实用能力内置搜索/替换面板新增SearcherPanel、SearcherBridge及toolbars/searcher模块通过工具栏searchhook 启用支持 CtrlF 查找、CtrlH 替换并配套中英文等多语言文案。仓库中 packages/cherry-markdown/src/toolbars/searcher/ 即为该模块的源码实现packages/cherry-markdown/test/toolbars/searcher/ 提供了对应测试。此外搜索框还新增了选中所有匹配项按钮。动态安装 mermaid#1603mermaid 从必须预置变为可按需动态加载配合 0.11.3 的mermaid 延时加载与代码块缓存机制修复让图表渲染在长文档与流式场景下更稳定。同版本还修复了es-toolkit依赖问题——移除该依赖并内置mergeWith、cloneDeep、escapeRegExp、debounce位于 packages/cherry-markdown/src/utils/toolkit/其中mergeWith采用 lodash 兼容语义修复了usePlugin两参数调用时不合并配置的问题。0.11.5——ESM 与 UMD/CDN 入口拆分v0.11.5 对构建产物做了重要调整ESM 产物不再挂载window.Cherry而 UMD/CDN 产物继续挂载并保持原 CDN 路径不变。这消除了 ESM 场景下全局变量的副作用side effect让 ESM 包可以被 tree-shaking。仓库中 index.core.js、index.core.umd.js、index.stream.js、index.stream.umd.js、index.umd.js 等多入口文件即对应 full/core/stream 三种能力的 ESM 与 UMD 形态。同版本还支持了拖拽插入文件#1787配合此前版本对拖拽上传的持续打磨形成了完整的拖放文件→走上传逻辑→插入内容链路。0.11.10——Vite 构建链与 Oxc 压缩器v0.11.10 将发布构建链迁移至 Vite并引入 Oxc 作为 JavaScript 压缩器。这一阶段的关键承诺是继续发布 ESM 与 UMD 两种产物现有 UMD 文件名和 CDN 集成路径保持不变存量用户无需改动引入方式新增cherry-markdown.core.esm.js、cherry-markdown.engine.js、cherry-markdown.engine.esm.js三个产物文件满足不同引入粒度core 版不含编辑器与流式能力engine 版仅含渲染引擎。同版本还修复了未提供 ECharts 时图表表格无法安全降级的问题并恢复 core 入口的MermaidPlugin命名导出此外修复了链接注入#1861 相关的安全问题。这与 0.11.1 中新增enableJs配置避免代码块渲染 echarts 引入安全风险一脉相承可见安全是该阶段持续投入的主线。0.11.7——时间线、选项卡、无限列布局与 setDisablev0.11.7 在语法与 API 层面均有新增新增时间线语法#1819多列布局支持配置对齐方式、支持无限列并新增选项卡语法#1820新增setDisable方法用于禁用编辑器#1816stream 包默认关闭下划线语法——这是流式输出场景下的有意取舍避免部分 Markdown 变体语法干扰 AI 增量输出降低engines.node约束从 24 到 22兼容 Node.js 22 用户安装搜索替换匹配项后不再自动滚动视口改善交互脚注样式优化默认不渲染脚注标题标题仅由title.render决定不再回退locale.footnoteTitle。v0.10.x主题体系重构与图表/公式能力爆发0.10.0——light 主题移除与 CSS 变量系统v0.10.0 是一次破坏性变更原有的light主题被移除default成为新的默认主题即原 light 主题的继承者。具体影响与迁移路径原本在themeSettings.mainTheme中配置light的用户升级后会自动切换为default主题自定义过light.scss的用户可将原文件底部的配置项迁移到default.scss同版本完成了主题 CSS 变量系统重构新增variables/目录基础效果变量、语义化界面变量、Open Color 颜色系统移除传统 SCSS 变量体系主题切换性能与可维护性显著提升移除toolbarTheme配置不影响功能主题切换仍由mainTheme控制清理废弃的 prettyprint 样式。仓库中 packages/cherry-markdown/src/sass/variables/ 与 packages/cherry-markdown/src/sass/themes/ 即是这套新主题体系的落地位置。0.10.0 图表能力JSON 化 options、cherry:mapping 与新增图型0.10.0 与 0.10.1 对表格图表插件cherry-table-echarts-plugin.js做了重大演进图表options配置格式改为更通用的JSON 格式并采取渐进式迁移——解析失败自动回退旧方案并打印弃用警告散点图支持语义化列标题通过特殊键名cherry:mapping指明映射关系并在解析后先做必要维度错误验证新增散点图、雷达图、地图、桑基图等图型图表适配各主题样式并修复导出问题图片样式编辑支持对齐方式左/中/右对齐、左/右浮动同时暴露出原生 JS 缺少 DOM 更新后回调机制的技术债务当时用setTimeout(..., 100)临时解决。0.10.1——移动端默认配置与复制重构新增默认 mobile 模式配置#1445重构复制逻辑剪贴板text/html携带富文本 HTML含样式text/plain携带原始 Markdown 源码。这意味着粘贴到微信公众号、Word 时保留格式粘贴到纯文本编辑器时得到 Markdown 源码表格交互全面重构新增菜单气泡、边界插入、列宽拖拽、拖拽高亮重写连续空格语法默认不支持与对应配置#1438目录TOC中特殊标记被引用的标题#1443。0.10.2/0.10.3——语法自动闭合与联想能力0.10.2/0.10.3 聚焦输入体验流式输出场景支持超链接、图片、标题、公式、脚注等语法的自动闭合#1521/#1522/#1531图片、音视频、语法自动闭合时可配置自定义占位#1524beforeMakeHtml/afterMakeHtml支持传入行内语法解析器作为第二个参数行内代码块支持自动补全修复urlProcessor未传入原始 url 的问题。v0.9.x流式会话Stream与 AI 场景适配0.9.0——changeset 发布流程与多端支持引入changeset自动化发布流程#1036CHANGELOG 从此采用 Changesets 的Patch Changes/Minor Changes格式这也是本文档后半部分条目格式的由来engine.makeHtml增加第二个参数预览逻辑避免自动加载图片资源#1130支持有序列表英文字母增加 React demoexamples/react_demo/增加禁用 html 的配置能力#1111。0.9.1/0.9.2——流式光标与缓存优化修复追加流式光标破坏超链接语法的问题#1170优化 cache 逻辑避免内存爆炸#1169脚注支持 hover 数字角标出现 tips 的能力#1080有序/无序/checklist 列表后续版本持续补齐所见即所得编辑。0.9.3/0.9.4——Node 环境与配置开放修复 Node 环境下engine.makeHtml()报错的问题#1179快捷键映射改用标准键名新增 html 标签属性白名单配置能力、自定义超链接属性配置能力#1206对齐方式增加两端对齐#1208代码块自定义按钮回调函数增加第四个参数#1202。v0.8.x所见即所得与多端生态成型表格、代码块、列表的 WYSIWYG 能力0.8.x 是 WYSIWYG所见即所得能力集中建设期v0.7.0引入表格 WYSIWYG v1.0#189v0.8.21丰富表格 WYSIWYG#479预览区支持 hover 添加行列、支持专注模式与打字机模式#503v0.8.25有序/无序/checklist 列表支持所见即所得编辑#543CodeBlock 所见即所得支持#549v0.8.27支持表格行/列拖拽改变位置#584v0.8.49/v0.8.50表格增加删除列操作、导出时处理懒加载图片。这些能力的实现分布在 packages/cherry-markdown/src/utils/tableContentHandler.js、listContentHandler.js、codeBlockContentHandler.js 等工具模块中预览区交互则依赖 PreviewerBubble.js 等气泡组件。输入联想Suggesterv0.6.1引入 suggester 功能v0.8.21Suggester 扩展#430v0.10.1支持输入联想功能配置与自定义候选项、行内公式与块级公式联想建议输入中文符号时给出英文联想#541。主题与国际化v0.8.8/v0.8.7增加切换主题功能与四个默认主题支持 protobuf 等更多代码高亮语言v0.8.47主题/代码块主题支持持久化优先级为本地缓存 配置 默认配置v0.8.36/v0.8.37引入主题缓存命名空间机制themeNamespace适用于多实例/多租户场景v0.8.50支持 frontMatter 语法并可在其中设置全局字体大小国际化支持 zh_CN/en_US/ru_RU见 packages/cherry-markdown/src/locales/。安全加固脉络0.8.x 期间的安全投入值得单列mathjax 引入 safe 组件防止 XSS 注入v0.8.37math 结果接入 dom purifierv0.8.35修复 raw html 的潜在 xssv0.8.35封装新的哈希算法md5 → sha256v0.8.530.11.9 修复引用式链接可绕过协议校验注入javascript:等危险协议的问题0.11.10 修复引入链接的注入问题。安全实现主要位于 Sanitizer.js 与 utils/sanitize.js测试覆盖见 packages/cherry-markdown/test/utils/sanitize.spec.ts。引擎与渲染理解 CHANGELOG 背后的核心架构要真正读懂这些版本变更需要了解 cherry-markdown 的渲染架构。从源码看Engine.js是渲染核心。它通过HookCenter加载 core/HooksConfig.js 中的语法 hook 列表core/hooks/目录下包含 AutoLink、Image、Ruby、FrontMatter、Space、Footnote、MathBlock、Detail、Panel 等 30 个语法模块并用AsyncRenderHandler做异步渲染调度引擎内置LRU 缓存hashCache最多缓存 20000 个渲染结果、hashStrMap最多缓存 2000 个哈希值对应 0.10.0 中 engine.js add LRU 的变更配合 0.11.0 新增的clearEngineCache接口解决了长文档与流式场景下的重复渲染开销引擎遵循实例级确定性内建段落 hook 每次从~~C0开始编号跨实例占位符一致这一点由 test/core/EngineDeterminism.spec.ts 等测试保障Cherry.config.js定义了大量默认回调与配置其中urlProcessor(url, srcType)支持image | audio | video | autolink | link五种来源类型fileUpload/fileUploadMulti给出了无图床场景下回显 base64 的默认实现——这与 0.8.24 未配置图片上传回调时以 base64 展示粘贴/拖拽图片的变更直接对应全量入口 index.js 默认注册 MermaidCodeEngine、PlantUMLCodeEngine、EChartsTableEngine 三个插件并处理 mermaid v9/v10/v11 多版本 API 差异mermaid.mermaidAPI在 v10 为 undefined。从 CHANGELOG 反推的升级迁移清单综合全文变更记录面向升级用户的迁移要点如下变更项影响版本迁移动作light主题移除default为新默认0.10.0mainTheme: light改为default自定义样式迁移到default.scssCodeMirror v5 → v60.11.0依赖编辑器内部 API 的自定义能力需验证vim 模式改为懒加载ESM 不再挂载window.Cherry0.11.5ESM 使用命名导入UMD/CDN 路径保持不变toolbarTheme移除0.10.0主题切换统一走mainTheme引擎缓存接口0.11.0新增clearEngineCache用于强制刷新渲染缓存Node 版本要求0.11.7 / 0.11.0engines.node 约束从 24 放宽至 220.11.0 曾要求 20.x表格图表 options 格式0.10.1渐进式迁移新配置用 JSON失败自动回退旧格式复制剪贴板格式0.10.1text/html为富文本、text/plain为 Markdown 源码行为更符合直觉脚注标题渲染0.11.7仅由title.render决定不再回退locale.footnoteTitle结语从变更日志读懂一个编辑器的成长曲线对照 packages/cherry-markdown/CHANGELOG.md 与源码实现可以看到cherry-markdown 的演进始终围绕渲染引擎的确定性、编辑交互的所见即所得、AI 流式场景的适配、构建产物的现代化四条主线展开。v0.11.x 的 CodeMirror 6 升级与 Vite 构建链迁移标志着该项目完成了一次彻底的内核现代化而贯穿 0.8.x 至 0.11.x 的安全修复记录协议校验、XSS 过滤、哈希算法升级则提醒使用者在引入任何 Markdown 编辑器时都应把渲染管道的 sanitize 环节作为接入校验的重中之重。对开发者而言CHANGELOG 中每一条fix与feat都能在 packages/cherry-markdown/src/ 与 packages/cherry-markdown/test/ 中找到对应的实现与测试这是深入理解该编辑器设计的最佳路径。赞分享前端UI组件富文本【免费下载链接】cherry-markdown✨ A Markdown Editor项目地址https://gitcode.com/GitHub_Trending/ch/cherry-markdown点击查看免费下载相关推荐SQLite.swift 版本演进全解析从 0.11 到 0.16 的核心能力里程碑与升级指引SQLite.swift 版本演进全解析从 0.11 到 0.16 的核心能力里程碑与升级指引 本文以 CHANGELOG.md https://link.g数据库ORMObsidian Dataview 版本演进全解析从 0.4 到 0.5 的核心特性、任务系统与性能架构变迁Obsidian Dataview 版本演进全解析从 0.4 到 0.5 的核心特性、任务系统与性能架构变迁 本文基于仓库中的 CHANGELOG.md ht前端知识管理数据分析visual-explainer 版本演进全解析从 0.1 到 0.11 的功能迭代与渲染架构演变visual explainer 版本演进全解析从 0.1 到 0.11 的功能迭代与渲染架构演变 本篇技术指南以仓库根目录下的 CHANGELOG.md h上一篇解锁QMC音频自由全平台播放解密工具全攻略下一篇twss.js高级功能从概率计算到自定义分类模型全攻略创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
觉得有用,分享给同行:

为您的企业打造数字门面

稳重轻奢商务风格,端正雅致视觉,长效耐看不易过时。

立即咨询 →