Archify：让 Claude Code 和 Codex 根据代码库生成交互式架构图

用 Cursor、Claude Code 或 Codex CLI 写完代码，架构图通常还得另外画。团队评审、代码交接都要用的，比较麻烦的是代码一改，然后原来的图很快就对不上了。

Archify 是一款开源 Agent Skill，可以让这些 AI 编程助手读取当前代码库或系统描述，再生成经过结构与布局检查的交互式 HTML 架构图。它不是在线画图网站，也没有拖拽编辑器，比较适合已经在用命令行 Agent、需要准备评审或交接文档的开发者。

安装后，可以直接对 Agent 说：“读取当前仓库，画一张运行时架构图。”模型负责分析代码并生成结构化描述，Archify 负责检查图表规则和完成渲染，减少在代码与画图软件之间重复整理的工作。

Archify 是什么？和在线架构图工具有什么不同

Archify 和 GitDiagram 这类“输入 GitHub 链接生成图表”的在线工具并不是一回事。它主要作为 Agent Skill 接入 Cursor、Claude Code、Codex CLI 和 OpenCode，也提供用于校验和渲染的 Node.js CLI。Archify 本身不包含大模型。

需要分析代码库时，宿主 Agent 使用的模型会读取其能够访问的代码或系统描述，并生成带有类型的 JSON IR（中间表示）。Archify 接收这份结构化数据，检查 Schema、组件布局和连线路由等图表规则，再渲染成自包含的交互式 HTML。代码是否会发送到云端，取决于你使用的 Agent、模型服务及相关设置。

Archify 的处理流程：
Agent 读取可访问的代码库或系统描述 → 模型生成带有类型的 JSON IR → Archify 检查 Schema、布局和连线路由 → 渲染成交互式 HTML 图表。

Archify 如何生成和校验交互式架构图

这份 JSON IR 进入 Archify 后，会接受 Schema、组件布局、HTML/SVG、连线路由以及标签与线路间距等检查。检查失败时，工具会返回对应的规则、对象和修正信息，让 Agent 针对有问题的部分调整，不需要重新生成整张图。

在 Preview 和 Deliver 工作流中，新版本只有通过检查才会更新；如果发现问题，Archify 会保留上一次可用的图表，并返回具体的错误位置，让 Agent 只修改有问题的部分。这样做主要解决的是图表容易报错、连线混乱和反复返工的问题。至于图里应该有哪些组件、服务和调用关系，则由 Agent 根据代码库内容来整理。

支持的图表类型和导出格式

Archify 不只生成系统架构图。想看系统由哪些服务组成、一次 API 请求经过了什么、数据流向哪里，可以选择不同的图表类型：

1、架构图（Architecture）：展示服务、数据库、缓存、外部系统和安全边界，适合查看系统整体结构。

2、工作流图（Workflow）：梳理 CI/CD、审批流程、运维步骤和 Agent 工具调用。

3、时序图（Sequence）：按照先后顺序展示 API 请求、鉴权、缓存回退和异步调用。

4、数据流图（Data Flow）：说明数据从哪里进入、经过哪些处理、保存在哪里，以及由谁继续使用。

5、生命周期图（Lifecycle）：展示任务或对象从创建、运行、等待、重试到结束的状态变化。

Archify 的主要产出是一个自包含的 HTML 文件，直接用浏览器打开即可。图表支持深浅主题切换、节点搜索、上下游查看和路径追踪，也能导出为 PNG、JPEG、WebP 或 SVG；启用动态效果后，还可以导出 WebM 动画。

如何在 Claude Code、Codex 和 Cursor 中安装并使用 Archify

安装前确认：
要在本地运行 Archify 的完整生成、校验和导出流程，需要安装 Node.js，并准备好 Cursor、Claude Code、Codex CLI 或 OpenCode 等兼容环境。

需要长期使用，可以通过下面的命令全局安装：

npx skills add tt-a1i/archify -g

如果只是想在 Codex CLI 中临时试用，不想安装到全局，可以使用：

npx skills use tt-a1i/archify@archify --agent codex

安装完成后，在需要分析的项目目录中打开 Agent，直接输入类似下面的要求：

请分析当前仓库，并使用 Archify 生成一张运行时架构图。

Claude.ai 也可以通过上传 archify.zip 添加 Archify Skill，但能否使用完整的渲染与校验功能，取决于沙盒是否提供 Node.js 访问权限。如果只是把 Archify 放入 Project Knowledge，它主要用于提供绘图规则和结构参考，无法调用完整的本地渲染与校验流程。想稳定使用全部功能，建议选择 Claude Code、Codex CLI、Cursor、OpenCode 或 Raven 等支持完整工作流的环境。

Archify、GitDiagram 和 Mermaid 怎么选

这三个工具都能生成技术图表，但使用方式并不相同。Archify 接入现有的 AI Agent，GitDiagram 从 GitHub 仓库链接开始分析，Mermaid 则由用户编写文本语法来生成图表。

如果只是想快速浏览一个 GitHub 项目，GitDiagram 更直接；

如果图表需要长期放在 Markdown 或技术文档里维护，Mermaid 更轻量；

Archify 更适合已经在使用 AI 编程 Agent，并且需要架构图、时序图或数据流图等交互式交付物的开发者。

Archify 适合谁？使用前要注意什么

Archify 要不要安装，主要看你平时怎么写代码、怎么交付技术图表。它比较像是 Claude Code、Codex 和 Cursor 的配套工具，不是传统的画图软件。

1、没有可视化拖拽画布：常规用法是在对话中让 Agent 调整节点、颜色和连线，也可以直接修改 JSON。需要用鼠标精细控制版式的话，draw.io、ProcessOn 这类工具更合适。

2、“零依赖”只指生成结果：导出的 HTML 文件不需要服务器或额外运行环境，直接用浏览器就能打开。生成图表时仍然需要 Node.js、兼容的 Agent，并可能消耗模型的 API 费用或订阅额度。

3、代码如何处理取决于宿主 Agent：Archify 本身不包含大模型。代码是否发送到云端，由你使用的 Agent、模型服务和相关设置决定。生成的图表也可能包含内部服务名称或文件路径，对外分享前需要自行检查。

4、没有多人实时编辑：Archify 交付的是独立 HTML 文件，不提供在线白板、评论和多人同时修改等协作功能。

5、项目仍在开发：截至 2026 年 8 月，官方页面显示的版本为 development · v2.16.0-dev.0。后续安装命令、支持环境和交互功能都可能调整。

如果你已经在用 Claude Code、Codex 或 Cursor，并且经常需要把代码库整理成架构图、时序图或数据流图，Archify 比单独打开画图软件更顺手。如果只是偶尔画一张简单流程图，或者需要团队在线协作，Mermaid、draw.io 或 ProcessOn 会更省事。

如果你需要的是可以直接在画布上修改节点和连线的方案，可以看看站内介绍的 Next AI Draw.io 对话式图表工具。它和 Archify 的使用方式不同，更接近传统的可视化编辑器。

Archify 常见问题

Archify 是免费的吗？

Archify 采用 MIT 协议，项目代码可以免费使用、修改和分发。宿主 Agent 调用模型时，仍可能消耗 API 费用或订阅额度。

不用 Cursor 或 Claude Code 能用吗？

可以。Archify 的完整工作流还支持 Codex CLI、OpenCode 和 Raven，项目也带有用于校验和渲染的 Node.js CLI。不同环境的安装方式并不完全相同。

能把已有的 Mermaid 图表转换成 Archify 吗？

Archify 没有通用的 Mermaid 自动导入功能。如果宿主 Agent 能够理解现有的 Mermaid 文本，可以让模型将其重新整理成 Archify 使用的 JSON IR，但这属于模型转换，不是 Archify 自带的解析器。

代码修改后，Archify 会自动更新架构图吗？

不会自动持续同步。代码发生变化后，需要重新让 Agent 分析仓库并生成图表。架构图还支持比较两份经过校验的快照，用来查看新增、删除、移动和连线路由变化。

Archify 源码与官方文档入口

Archify GitHub 项目主页：https://github.com/tt-a1i/archify

Archify 官方文档：https://tt-a1i.github.io/archify/