🚀 快速安装

复制以下命令并运行，立即安装此 Skill：

npx skills add https://skills.sh/jaganpro/sf-skills/sf-diagram-mermaid

💡 提示：需要 Node.js 和 NPM

sf-diagram-mermaid: Salesforce 图表生成

当用户需要基于文本的图表时使用此技能：用于架构、OAuth、集成流程、ERD 或 Agentforce 结构的 Mermaid 图表，并在需要纯文本兼容性时提供 ASCII 回退方案。

此技能适用的场景

当用户需要以下内容时，使用 sf-diagram-mermaid：

  • Mermaid 输出
  • ASCII 回退图表
  • 以 Markdown 友好形式呈现的架构、序列、流程图或 ERD 视图
  • 可直接嵌入文档、README 或问题中的图表

当用户需要以下内容时，委托给其他技能：

  • 渲染的 PNG/SVG 图像或精美的设计稿 → sf-diagram-nanobananapro
  • 仅涉及非 Salesforce 系统 → 使用更通用的图表生成技能
  • 在生成 ERD 之前需要对象发现 → sf-metadata

支持的图表类型

类型 推荐的 Mermaid 形式 典型用途
OAuth / 认证流程 sequenceDiagram 授权码、JWT、PKCE、设备流
ERD / 数据模型 flowchart LR 对象关系及共享上下文
集成序列 sequenceDiagram 请求/响应或事件编排
系统架构 flowchart 高层级架构
角色/访问层级 flowchart 用户、配置文件、权限
Agentforce 行为图 flowchart 智能体 → 主题 → 操作关系

需要预先收集的上下文

询问或推断：

  • 图表类型
  • 涉及的范围和实体/系统
  • 输出偏好：仅 Mermaid、仅 ASCII 或两者都需要
  • 样式要求：极简、面向文档还是适合演示
  • 对于 ERD：是否有可用的组织元数据进行参考

推荐工作流程

1. 选择正确的图表结构

  • 使用 sequenceDiagram 表示按时间顺序的交互
  • 使用 flowchart LR 表示 ERD 和能力图
  • 尽可能让每个图表讲述一个核心故事

2. 收集数据

对于 ERD 和需要实际数据的图表：

  • 当需要真实模式发现时，使用 sf-metadata
  • 在适当情况下，可选择使用本地元数据辅助脚本获取计数/关系上下文

3. 首先生成 Mermaid

应用以下原则：

  • 准确的标签
  • 简单可读的节点文本
  • 一致的关系表示法
  • 在 Markdown 查看器中能清晰渲染的适度样式

4. 在有用时添加 ASCII 回退方案

当用户需要终端兼容性或纯文本文档时，提供 ASCII 版本。

5. 简要解释图表

指出关键关系、流程方向以及任何假设。

高质量规则

对于序列图

  • 当步骤顺序重要时使用 autonumber
  • 清晰区分请求与响应
  • 谨慎使用注释描述协议细节

对于 ERD

  • 优先使用 flowchart LR
  • 保持对象卡片简洁
  • 使用清晰的关系箭头
  • 除非用户明确要求字段级细节，否则避免过多字段
  • 仅在能提高可读性时对对象类型使用颜色编码

对于 ASCII 输出

  • 保持合理的宽度
  • 一致地对齐箭头和方框
  • 优化可读性，而非装饰性

输出格式

## <图表标题>

### Mermaid 图表
```mermaid
<图表内容>
```

### ASCII 回退版本
```text
<ascii内容>
```

### 说明
- <关键点>
- <假设 或 限制>

跨技能集成

需求 委托给 原因
真实对象/字段定义 sf-metadata 基于实际数据的 ERD 生成
渲染图表/图像输出 sf-diagram-nanobananapro 超越 Mermaid 的视觉美化
连接应用认证设置上下文 sf-connected-apps 准确的 OAuth 流程
Agentforce 逻辑可视化 sf-ai-agentscript 行为细节的事实来源
Flow 行为图 sf-flow 基于实际 Flow 逻辑的参考

参考映射

从这里开始

样式 / ERD 细节

预览

评分指南

分数 含义
72–80 可投入生产的图表
60–71 清晰有用，仅需少量优化
48–59 功能可用但可更清晰
35–47 需要结构改进
< 35 不准确或不完整