展开本页目录
开始前准备什么
- 下载独立练习包，保留 starter、reference 和原始输入。
- 现代桌面浏览器支持指针和文件下载；改React Flow源码需Node/npm。
- 使用Cursor原生功能需相应账号和可用额度；本题作者参考可在本地独立运行。
- 准备四节点无边初始画布
- 让Cursor实现连接与文件合同
- 用真实handle建立三条边
- 拒绝重复、自环与有向环
- 导出现场节点、边与viewport
- 刷新恢复并拒绝坏文件
- 从材料重做鼠标与文件验收
starter、任务提示、具体输入、作者人工可运行参考与独立验证；不含账号/密钥/运行时数据库。
按本文环境运行，再对照原始输入和正反例。
1. 准备四节点无边初始画布
打开只有四个节点的本地画布：读取草稿、检查字段、人工确认、生成清单。每个节点有真实source/target手柄，不是静态Mermaid。
2. 让Cursor实现连接与文件合同
让 Cursor 按 TASK.md 实现连接检查、schemaVersion和整份文件校验。启动已构建reference；改源码后 npm ci、npm run build。
交给目标 AI 工具的任务提示
使用 React Flow；四个具体节点“读取草稿/检查字段/人工确认/生成清单”。允许真实 handle 拖线，拒绝自环/重复边/有向环。导出 schemaVersion/nodes/edges/viewport，导入先校验悬空 ID；不得只画静态 Mermaid 或用文本按钮伪造拖拽。3. 用真实handle建立三条边
用鼠标从节点底部拖到另一节点顶部，先建立 read→check、check→review，再接 review→export，观察实际连线数量。
4. 拒绝重复、自环与有向环
尝试 export→read形成回路，或重复边/自环，应拒绝而不增加边。检查逻辑依据已有有向边，不以固定禁止某个节点名代替。
5. 导出现场节点、边与viewport
点导出流程JSON，读取 nodes/edges/viewport 和 schemaVersion。坐标与当前图对应，不能只下载一个固定示例文件。
6. 刷新恢复并拒绝坏文件
刷新后图回到初始无边，选择实际导出文件恢复3条边。再导入悬空target/重复ID输入，应整份拒绝且当前合法图保持。
7. 从材料重做鼠标与文件验收
从独立ZIP重新拖线、导出、刷新和恢复，核对文件内容。该编辑器只编辑图，不执行图中的AI节点、调度或外部服务。
怎样确认已经完成
- 合法拖线会生成真实边，自环/重复/回路均被拒绝；必须实际鼠标操作。
- 导出 JSON 的节点/边/viewport 与现场一致，刷新后恢复不丢内容和位置。
- 损坏文件整份拒绝且不破坏当前图；界面不宣传已运行图中的 AI/外部服务。
常见问题
Cursor 能做像工作流工具那样拖拽连线的页面吗？
用鼠标从节点底部拖到另一节点顶部，先建立 read→check、check→review，再接 review→export，观察实际连线数量。
AI 做的流程编辑器怎么防止连成死循环？
尝试 export→read形成回路，或重复边/自环，应拒绝而不增加边。检查逻辑依据已有有向边，不以固定禁止某个节点名代替。
哪些结果已执行，哪些仍需原生账号验证？
真实React Flow手柄拖线、防环、实际JSON下载、刷新恢复和坏文件整份拒绝已验；Cursor会话/AI节点执行未执行。