以 skill 自身的术语
将英文描述或 Mermaid 源码转换为一套三件套图表:Mermaid 源文件(.mmd)、可在 excalidraw.com 打开的可编辑 Excalidraw 文件(.excalidraw),以及渲染后的 SVG 和 PNG 输出。渲染完全通过本地回环服务器离线完成——运行时使用 Aside 浏览器,否则使用 gstack 自带的无头浏览器。
流程图(graph LR/TD)和序列图会生成完全可编辑的 Excalidraw 场景,包含真实的方框、箭头和文字。其他 Mermaid 图表类型(状态图、类图、甘特图)会渲染为 SVG/PNG,并作为 Excalidraw 文件中的单一图像元素导出——可移动、可标注,但不可编辑元素本身。Mermaid 源文件始终是用于迭代的唯一事实来源。
它产出什么
- 一个 Mermaid 源文件(.mmd),作为对 LLM 友好的交换格式和唯一事实来源。
工作方式
- 01编写 Mermaid 源码
编写符合用户需求的 Mermaid 代码。管线/流程优先使用 graph LR,层级结构优先使用 graph TD。
- 02每个会话中暂存一次渲染包
将 diagram-render.html 暂存到 gstack 的渲染暂存目录 ${TMPDIR:-/tmp}/gstack-render 中,按 bundle SHA 进行内容寻址。
- 03用一条命令渲染三件套
编写 .mmd 文件,然后使用暂存好的 bundle 运行 gstack-render。
- 04展示并交付
内联读取 PNG,让用户看到图表。列出三元组路径,并说明该 .excalidraw 文件可在 excalidraw.com 打开进行编辑。