Cherry Markdown 文档生成一条 export() 调用打通 PDF、长图与 Word 交付【免费下载链接】cherry-markdown✨ A Markdown Editor项目地址: https://gitcode.com/GitHub_Trending/ch/cherry-markdown写技术文档时源文件是 Markdown但交付形态从来不止一种周报要粘进 Word发版说明要一份 PDF评审现场还要一张能直接甩进群里的长图。手动截图、复制粘贴或者自己写转换脚本每一路都容易在样式上翻车——Cherry Markdown 的渲染规则长在编辑器内部外部脚本很难完整复现。Cherry Markdown 的文档生成能力核心就落在一条export()调用上编辑器内置了完整的导出管线五种交付格式各有不同的实现机制。读懂这套机制你才能选对出口、避开各自的坑。读完这篇你会拿到直接调用export()一行代码产出全部五种交付格式看清 PDF 打印管线、长图位图化、Word 剪贴板写入三条路径的边界写出一段带完成事件的批量导出脚本接入自己的发布流程用cherry:export:done事件把导出动作嵌入自动化检查点一条调用背后的五个出口export() 的最小签名// type: pdf | screenShot | markdown | html | word // fileName 缺省时自动取文档第一行文字作为文件名 cherry.export(type, fileName);一句话结论文件名不传也不至于翻车——getFirstLineText会拿预览区第一行非空文本兜底文件名和文档标题天然对齐省掉每次手敲。适合随手导出场景走归档流程时建议显式传参把版本号写进文件名。PDF借道浏览器打印管线 结论PDF 不生成文件而是把打印变成受控动作分页和版式全部复用现有样式。exportPDF在utils/export.js里做四件事把预览区克隆到 body 顶层、临时隐藏编辑器与工具栏、强制展开所有折叠代码块、加上cherry-export-only打印样式最后调window.print()让你在系统对话框里存成.pdf。打印样式sass/print.scss里对img、table、pre统一加了page-break-inside: avoid代码块和表格不会被拦腰截断。适合需要严格版式和分页的归档件不适合移动端或无头环境——这条路全程依赖浏览器的打印能力。长图html2canvas 一次性铺满 结论长图是把预览区整块画进 canvas的位图化结果所见即所得但代价是内存。exportScreenShot会先剥离audio/video节点、强制展开折叠代码块再让 html2canvas 按预览区宽高截图ignoreElements只保留预览区自身及其携带样式的祖先节点避免把工具栏一起截进去。产物是.png发群、贴社媒最顺手。适合单屏到几屏的内容超长文档会生成超高位图内存压力大不适合上百页的文档。Word复制即导出公式先变图片 结论Word 路线不直接落盘而是把富文本写进剪贴板最后一步由你粘贴完成。exportWordFileutils/exportWord.js先把预览区 HTML 放进一个隐藏容器逐个把 mermaid 和数学公式块里的svg栅格化成 PNG 再拼回文档——SVG 直接粘进 Word 会变形位图化是必要的一步随后套一层基础排版样式通过navigator.clipboard.write写入text/html弹出已复制请打开 Word 按 CtrlV的提示。适合给甲方或协作方交正式文档需要 HTTPS 或 localhost 环境授权剪贴板且最终多一个人手动作。HTML 与 Markdown两条最短路径结论这两个格式没有任何渲染依赖是自动化链路里最稳的素材。exportHTMLFile拿渲染后的结果套一个标准 head 落盘exportMarkdownFile直接取原文。它们更像是素材——PDF、长图、Word 才是最终交付形态。五种形态速查格式触发路径适用场景主要代价.pdfwindow.print()归档、打印分发依赖浏览器打印能力.png长图html2canvas位图发群、社媒分享超长文档内存吃紧Word剪贴板写入对外正式文档需手动粘贴一步.htmlBlob 下载二次加工、内部分发无.mdBlob 下载归档、自动化链路无从单次导出到团队流水线最小闭环长这样源文件统一放docs/发布日从docs/挑当期文件export()一次出.md、.pdf、.png三件套产物按文档名_版本命名交付后把链接同步进发布说明。下面这段批量脚本适用于页面内逐个文档导出的场景浏览器控制台或页面内脚本均可每轮导出都等cherry:export:done事件再走下一轮Word 那格自动跳过——剪贴板不会替它写文件// 适用条件当前页面内存在已初始化的 cherry 实例 const queue [ { file: release-notes, types: [markdown, pdf, screenShot] }, { file: user-guide, types: [markdown, pdf] }, ]; function runExport(cherry, task) { return new Promise((resolve) { const done (e) { if (e.detail.file task.file) { window.removeEventListener(cherry:export:done, done); resolve(); } }; window.addEventListener(cherry:export:done, done); const fileName ${task.file}_v1.0; for (const t of task.types) cherry.export(t, fileName); }); } (async () { for (const task of queue) await runExport(cherry, task); console.log(全部导出完成); })();团队落地 checklist✅ 源文件进版本库且第一行是文档标题默认文件名依赖它✅ 交付只认发布/目录里的产物不认聊天工具里随手转发的版本✅ 发版固定走md、pdf、png三件套Word 仅用于对外正式文档✅ 产物文件名带版本号归档可追溯✅ 发布说明里贴产物链接并保留上一版以便回滚边界、代价与下一步交付格式与机制对照示意具体表现以所用浏览器版本为准格式依赖已知限制.pdf浏览器打印移动端不可用.pnghtml2canvas跨域外网图可能丢失Word剪贴板 API需手动粘贴.md/.html无无特殊限制这套方案的本质是页面内导出PDF 和 Word 都无法脱离当前浏览器上下文自动落盘需要服务端批量转 PDF 或无头自动化的团队应另寻 headless 渲染加独立 PDF 引擎的方案。长图导出中依赖 SVG 滤镜的元素和跨域外网图片都可能丢失敏感文档交付前值得人工核对一遍产物。先挑一份高频交付文档把docs/ → 发布/的三件套链路完整跑一遍确认各格式在目标浏览器下的实际表现再向全团队推广。【免费下载链接】cherry-markdown✨ A Markdown Editor项目地址: https://gitcode.com/GitHub_Trending/ch/cherry-markdown创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考