Repository navigation
Home
sunsonliu(刘阳) edited this page Oct 30, 2026
·
17 revisions
欢迎来到 Cherry Markdown Wiki！这里是文档的落地页，你可以：
Cherry Markdown 是一款由 Tencent 开源的纯前端 Markdown 编辑器组件，由解析引擎、工具栏、编辑区、预览区四部分组成，开箱即用、可深度定制。详细介绍见 初识 cherry-markdown 编辑器。
English documentation is work-in-progress. For now, please refer to the inline comments and API examples.
- 最简实现 — 几乎完全使用默认配置，引入 css + js + 一个 div + 三行代码即可运行
- H5 — 纯编辑模式和纯预览模式
- 全部功能 — 双栏编辑、自定义工具栏、自定义语法、所见即所得编辑、主题切换等能力的综合演示
- 注入 — 演示如何通过配置支持 js/iframe 注入（典型场景：查看页需要运行脚本）
- 流式输入模式（AI chat 场景） — 打开流式输入后，加粗斜体、代码块、无序列表、表格等内容的输入更加稳定（样式不会突然跳变或反复横跳）
最简引入（引入 /dist/ 目录下的 js 和 css 即可）：详细步骤见 hello-world，各构建产物的差异见 构建产物介绍。
本地开发：
cd cherry-markdown
yarn
yarn dev跑起来后可访问本地示例页；更详细的工程说明、Node.js 版本要求、monorepo 结构见 贡献指南 Contribution-Guidelines。
Vue 3 用户注意：请避免使用 Vue 3 的响应式代理（
reactive/ref）包裹 cherry 实例，否则会引入各种难以排查的 bug。原因：Vue 3 的 Proxy 会劫持 CodeMirror 对自身属性的访问，导致编辑器状态异常。
推荐做法：用
markRaw(cherry)或shallowRef持有实例。详见 issue #381 的讨论。
- 特性展示 features — Cherry 支持的所有能力一览
- 初识 cherry-markdown 编辑器 — 组成、特点、目录结构与规划
- 竞品分析 — 与同类编辑器的对比
- hello world — 最简接入示例
-
构建产物介绍 —
/dist/目录下各文件的用途，以及如何引入 mermaid / echarts
欢迎提 Issue 或 PR！请先阅读：
📅 本文最近更新于 2026-10-30；若发现与现状不一致，欢迎提 PR 修订。