mcpField
M
mermaid-diagrams

mermaid-diagrams

github.com/ccheney文档处理61467 次安装7 周前更新
代码仓库

关于 mermaid-diagrams

Mermaid Diagrams 是将给定流程、代码、模式或关系转换为 Mermaid 图表的 Skill。它帮助选择图表类型、依据现有信息表达内容而不补造缺失事实,并生成适合目标渲染器的语法。

主要功能

  1. 01按表达目的选择图表类型
  2. 02创建流程图与时序图
  3. 03建模数据、状态、类和服务
  4. 04保留已给事实并标注假设
  5. 05提供可渲染 Mermaid 语法指引

适用场景

  1. 01梳理流程步骤与决策路径
  2. 02展示参与者之间的调用顺序
  3. 03表达数据库表及其关系
  4. 04记录状态或服务之间的关系

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/ccheney/robust-skills --skill mermaid-diagrams

安装后在 Claude Code 中输入/mermaid-diagrams确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

references/
ADVANCED.md
ARCHITECTURE.md
CHEATSHEET.md
CLASS-ER.md
DATA-CHARTS.md
FLOWCHARTS.md
SEQUENCE.md
STATE-JOURNEY.md

详细介绍

Mermaid 图表

将提供的流程、代码、架构或关系转换为所需的 Mermaid 图表。用户的明确指示优先于本技能的指南,包括用户对输出格式的选择。

选择表示方式

确定要展示的事实和目标渲染器。如果请求未指定格式,且基于文本的系统/流程图适用,那么 Mermaid 是合理的选择。保留明确指定的绘图工具或制品格式。

问题图表
接下来会发生什么,或会选择哪条路径?flowchart
谁按什么顺序调用谁?sequenceDiagram
有哪些表以及基数关系?erDiagram
有哪些状态和转换?stateDiagram-v2
类型或服务之间有何关联?classDiagram 或带子图的流程图
有哪些计划安排或测量数据?参考资料中相应的规划/数据类型

节点、边、基数、日期和值均应依据提供的证据。标注概念性假设;对于决定图表内容的缺失事实,应先询问,而不是自行编造系统。

生成可渲染的结果

  • 返回一个带围栏的 mermaid 代码块,或用户要求的 .mmd/渲染后制品。每个代码块只使用一种图表声明。
  • 优先采用目标环境支持的稳定语法。示例已通过 Mermaid 11.16 检查;宿主环境可能内置更早版本。
  • 为节点设置稳定 ID,并确保其与显示标签和子图 ID 不同。标签中含有标点时应加引号;避免使用保留字 end 作为 ID,并将 %% 注释放在独立行上。
  • ER 属性每行列出一个;名称中含空格的序列图参与者应使用别名。
  • 当可读性下降时拆分图表,而非按固定节点数量拆分。

使用项目的渲染器或可用的 Mermaid CLI 验证复杂语法或修复后的语法。生成制品时,检查渲染结果;如果无法渲染,应说明这一限制。简单的语法问题无需安装新的工具链。

参考资料

加载所需的图表类型或渲染主题。

任务参考资料
流程图、子图、形状、边FLOWCHARTS.md
调用、激活、循环、分支SEQUENCE.md
类、类型、数据库关系CLASS-ER.md
状态机和用户旅程STATE-JOURNEY.md
甘特图、时间线、饼图、XY 图、桑基图、思维导图、gitGraphDATA-CHARTS.md
C4、架构图、块图、看板、数据包、需求ARCHITECTURE.md
配置、样式、导出、故障排除ADVANCED.md
精简语法和平台查询CHEATSHEET.md

遇到对版本敏感的功能时,请查看 Mermaid 文档和目标环境自己的支持说明。

评论

支持 Markdown