mcpField
D
data-flow

data-flow

github.com/athola开发34383 次安装1 天前更新
代码仓库

关于 data-flow

data-flow 是用于追踪代码库中请求与数据流向的技能，并将流程整理为 Mermaid 时序图。它指导代码探索、图表生成和渲染，适合调查系统行为或 API 调用链的开发者。

主要功能

  1. 01探索代码库数据流
  2. 02生成 Mermaid 时序图
  3. 03映射请求与响应
  4. 04标注数据转换
  5. 05验证并渲染图表

适用场景

  1. 01追踪请求经过系统组件的路径
  2. 02记录数据转换流水线
  3. 03梳理 API 调用链
  4. 04调查功能调用后的处理过程

MCP 相关

使用 Mermaid Chart MCP 验证并渲染生成的时序图。

安装

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

$npx skills add https://github.com/athola/claude-night-market --skill data-flow

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

详细介绍

数据流图

生成 Mermaid 时序图，展示代码库中各组件之间的数据流动方式。

适用场景

  • 跟踪请求在系统中的流转
  • 了解数据转换流水线
  • 记录 API 调用链
  • 回答“调用 X 时会发生什么？”

不适用场景

  • 静态调用结构（使用 cartograph:call-chain）
  • 流程步骤和状态转换（使用 cartograph:workflow-diagram）

工作流

步骤 1：探索代码库

分派代码库探索 Agent：

Agent(cartograph:codebase-explorer)
Prompt: Explore [scope] and return a structural model.
Focus on function calls, data transformations, and
inter-module communication for a data flow diagram.
步骤 2：生成 Mermaid 语法

将结构模型转换为 Mermaid 时序图。

数据流图规则：

  • 对于请求／响应流，使用 sequenceDiagram
  • 参与者应为模块或组件（而非函数）
  • 箭头表示数据方向：调用使用 ->>，返回使用 -->>
  • 对于长时间运行的操作，使用 activate／deactivate
  • 使用 Note over 标注数据转换
  • 参与者最多限制为 8-10 个
  • 对于条件流，使用 alt／else
  • 对于循环调用，只展示一次并添加注释

输出示例：

sequenceDiagram
    participant User
    participant Command as /commit
    participant Sanctum as sanctum.commit
    participant Leyline as leyline.git_platform
    participant Git

    User->>Command: /commit
    Command->>Sanctum: generate_message()
    Sanctum->>Leyline: get_staged_changes()
    Leyline->>Git: git diff --cached
    Git-->>Leyline: diff output
    Leyline-->>Sanctum: structured changes
    Note over Sanctum: Classify change type
    Sanctum-->>Command: commit message
    Command->>Git: git commit -m "..."
步骤 3：通过 MCP 渲染

调用 Mermaid Chart MCP 进行渲染：

mcp__claude_ai_Mermaid_Chart__validate_and_render_mermaid_diagram
  prompt: "Data flow diagram of [scope/feature]"
  mermaidCode: [generated syntax]
  diagramType: "sequenceDiagram"
  clientName: "claude-code"

如果渲染失败，请修正语法并重试（最多重试 2 次）。

步骤 4：展示结果

展示渲染后的图表，并用简短说明描述所呈现的流程（2-3 句话）。

退出条件

  • 已生成包含参与者和至少一个 ->> 调用箭头的 Mermaid sequenceDiagram 语法
  • 已调用 mcp__claude_ai_Mermaid_Chart__validate_and_render_mermaid_diagram，并传入 diagramType: "sequenceDiagram"，且调用成功（或首次失败后已尝试重试）
  • 参与者数量最多为 10 个；如果组件更多，则应将其合并，并注明合并情况
  • 已在渲染后的图表旁展示 2-3 句话，描述所呈现的流程
  • 对于在跟踪流程中有对应响应的请求，均包含返回箭头（-->>）

评论

支持 Markdown