流程图与架构图

这页放的是最接近日常技术文档的图：架构 运行时流程 发布链路 与高度决策

工作区架构

flowchart LR
  Root["workspace root"] --> Package["packages/markdown-it-mermaid-enhanced"]
  Root --> Playground["apps/playground"]
  Root --> VitePress["apps/vitepress"]
  Package --> Runtime["runtime + style exports"]
  Package --> Plugin["markdown-it plugin"]
  VitePress --> Plugin

Loading diagram…

文档渲染流水线

flowchart LR
  Author["作者写 Markdown"] --> Parse["markdown-it 解析 fence"]
  Parse --> Wrap["插件输出 wrapper HTML"]
  Wrap --> Hydrate["运行时升级 wrapper"]
  Hydrate --> Render["Mermaid.js 或 Excalidraw 渲染 SVG"]
  Render --> Export["缩放 复制 导出 与全屏"]

Loading diagram…

发布流程

flowchart TD
  Change["代码或文档改动"] --> Validate["bun run test && bun run build"]
  Validate --> Package["package dist 产物"]
  Package --> ExampleApps["playground 与 vitepress 应用"]
  ExampleApps --> Review["人工检查"]
  Review --> Publish["发布包"]

Loading diagram…

高度决策链

flowchart TD
  Inline["行内 min-height"] --> Result["最终高度"]
  CssVar["--mermaid-it-min-height"] --> Result
  Plugin["插件 minHeight"] --> Result
  Default["内建默认值"] --> Result

Loading diagram…