Markdown 实时双栏编辑器, 代码高亮 + 自动目录 + 一键复制富文本

真实使用场景

• 写周报, 直接复制粘到飞书钉钉里, 格式不丢

  下拉里选 "周报" 模板, 编辑器会给你一份预排好的骨架, 包含 本周完成、进行中、下周计划、求支持 四块。左边把要点填进 去, 右边实时渲染。写完点 "复制富文本", 切到飞书或企业微信 群, 粘贴一下, 标题、代码块、链接、加粗全在。同一份复制 粘到只接纯文本的地方 (比如某些聊天软件的回复框) 拿到的是 干净的 Markdown 源码。一次复制两边都能用, 不用再回来重新 格式化。

• 写技术博客, 代码块语法高亮, 一键导出到博客源码目录

  从 "技术博客" 模板开始, 标题给一句具体的收获, 写问题、试过 哪些没用、什么真的有用、为什么、一句话收尾。把你真实的代码 放进围栏代码块里, 8 种语言的高亮器会给关键字、字符串、 数字、注释分别上色, 不用引外部 CSS。导出 .md 直接丢进 Astro、Hugo、Next.js 的 content 目录就能发, 或者导出 .html 单文件直接邮件发出去也行。中途出去吃饭也不怕, 草稿一直 存在 localStorage 里。

• 维护项目 README, 实时大纲 + 一键导出

  README 模板自带安装、快速开始、API、许可几块。标题加得越 多, 右边的大纲就越完整, 整个文档的结构一目了然。生成的 标题带 GitHub 兼容的 id 属性 (slug 化, 重名自动加 -1 -2), 导出之后锚点链接照样能点。看着满意了点 "导出 .md", 提交 到仓库, GitHub 上看到的目录结构和预览里看到的完全一致, 锚点也都能跳。

• 开会做纪要, 行动项用 checkbox, 导出之后还在

  选 "会议纪要" 模板, 框架已经搭好, 包含目标、讨论、决议、 行动项。行动项写成 - [ ] 责任人 任务 截止时间 的格式, 预览里就是真正的 checkbox (只读的, 故意做成只读, 免得开 会时点错), 看起来正式很多。会后复制富文本粘到飞书云文档 或钉钉文档, 或者导出 .md 入仓库 meetings/ 目录, 都行。

• 写函数文档, 粘到 Confluence 或 Notion 里结构不乱

  "函数文档" 模板按业内标准排好了 参数、返回值、示例、备注 几块。示例写在 ts 围栏代码块里, 类型注解会被高亮。复制 富文本粘到 Notion 或 Confluence, 参数表格、代码块、列表 都保持结构, Confluence 对 HTML 那份解析得特别好, 代码块 的等宽字体一并保留, 不会变成一坨普通文本。

常见踩坑

• 在需要纯代码的地方点了 "复制富文本"。粘进 GitHub 的代码框里会变成一坨带样式的 HTML 而不是代码。这种场景应该点 "复制 MD", 拿到的是原始 Markdown, 粘到 GitHub 的代码框里就是普通文本, 不会被格式化。

• 想在 Markdown 里写原生 HTML 标签。本编辑器为了防止正文里不小心写到 div 或 script 把预览撑坏, 会把所有尖括号转义成实体。真要 HTML 透传, 在这里写, 导出 .md, 再用支持 HTML pass-through 的渲染器 (代价是 XSS 风险, 我们权衡过, 决定不做)。

• 期望 LaTeX 公式渲染出来。我们把 $x^2$ 透传成 code.math, 下游渲染器 (GitHub 不支持, GitLab 支持, Hugo 加 KaTeX 支持) 可以接住继续渲染。预览这边故意只显示源码, 引 KaTeX 会让 bundle 翻倍。要立刻看到公式渲染就把 .md 复制到带 KaTeX 或 MathJax 的渲染器去。

隐私说明