流程图只是入口,技术文档里常见的时序 状态 时间线 与 Git 图同样会走这套 wrapper 与运行时
sequenceDiagram participant Author as 作者 participant Markdown participant Plugin as 插件 participant Runtime as 运行时 participant Mermaid Author->>Markdown: 编写 Mermaid fence Markdown->>Plugin: 解析 fenced block Plugin->>Runtime: 输出 wrapper markup Runtime->>Mermaid: 初始化并渲染 Mermaid-->>Runtime: 返回 SVG Runtime-->>Author: 展示可交互图表
stateDiagram-v2 [*] --> Idle Idle --> Rendering: 发现 wrapper Rendering --> Ready: svg 挂载完成 Rendering --> Error: 解析失败 Ready --> Rendering: 触发 rerender Error --> Rendering: 更新源码
timeline title 示例集成时间线 1 : 注册 markdown-it 插件 2 : 导入运行时样式 3 : 初始化 VitePress 运行时 4 : 调整 --mermaid-it-min-height 5 : 扩充多页面示例
gitGraph commit id: "setup" branch feature/docs checkout feature/docs commit id: "add zh pages" commit id: "add sizing priority" checkout main merge feature/docs commit id: "ship demo"
mindmap
root((文档站重写))
指南
快速开始
渲染引擎
手绘与字体
示例
流程图
渲染模式
高级图形
参考
插件选项
Fence 选项
运行时 API