【免费下载链接】drawbridgeDesign editor for Claude Code and Cursor. Figma Comments for the browser, are sent directly to Claude Code and Cursor as prompts.项目地址https://gitcode.com/gh_mirrors/drawbridge1/drawbridge点击查看免费下载使用 Drawbridge浏览器视觉标注工具时最常见的三类故障是连接断开、任务丢失、AI 找不到文件。Drawbridge 会把你在浏览器里像 Figma 批注一样留下的评论批量写入项目的.moat/目录再由 Cursor 或 Claude Code 通过bridge命令处理成代码修改。理解了这条「浏览器 → 任务文件 → AI」的链路90% 的常见问题都能快速定位。本文用排查清单的方式带你逐一解决这三类问题并给出预防建议。一、先搞懂 Drawbridge 的数据流才能对号入座Drawbridge 由三部分组成排查时先确认问题出在哪个环节环节位置作用Chrome 扩展chrome-extension/在网页上点选元素、画矩形、写批注任务文件项目下的.moat/目录存储moat-tasks.md人读和moat-tasks-detail.jsonAI 读AI 端Cursor / Claude Code执行bridge或/bridge命令处理任务核心文件一览连接项目后自动生成moat-tasks.md勾选框形式的任务清单moat-tasks-detail.json包含选择器、截图路径、状态的机器可读数据drawbridge-workflow.mdAI 的「大脑」规则模板screenshots/每条批注的截图帮 AI 理解你的意图 记住扩展只负责写文件AI 只负责读文件。两边「见不到对方」的所有现象基本都是连接或目录问题。二、症状 1Drawbridge 连接断开怎么办2.1 为什么每次重启浏览器都要重连这是浏览器安全机制的正常限制不是 Bug。File System Access API 的目录句柄不能跨浏览器会话持久保存以下情况都会导致连接失效✅ 浏览器重启最常见✅ 项目目录被重命名或移动✅ 浏览器数据被清除✅ 扩展更新而页面刷新、切换标签页不会断开连接。2.2 三种重新连接方式快捷键重连在浏览器中按CmdShiftPMac或CtrlShiftPWindows重新选择项目目录扩展图标重连点击 Drawbridge 扩展图标或点侧边栏设置图标⚙️再连接控制台重连在浏览器控制台执行setupProject()重连后扩展会自动重新部署规则模板见 ARCHITECTURE.md 连接生命周期无需手动操作。2.3 一键检查连接状态在浏览器控制台执行window.directoryHandle ? ✅ Connected : ❌ Not Connected如果显示 Not Connected批注就不会落盘——这就是「任务不保存」的根本原因。2.4 疑难杂症用内置诊断命令扩展提供了调试接口详见 content_script.jswindow.moatDebug.diagnoseConnection() // 完整连接诊断 window.moatDebug.checkSystemStatus() // 系统状态检查 window.moatDebug.verifyFiles() // 验证任务文件健康度三、症状 2任务丢失怎么找回「任务消失」通常不是真丢了而是没写进去或状态没同步。按下面顺序排查3.1 确认.moat/目录是否真的生成了打开项目根目录看是否有.moat/文件夹。如果没有说明扩展从未成功连接按第二节重连即可。3.2 任务状态不同步以 JSON 为准Drawbridge 采用双文件设计见 taskStore.jsmoat-tasks.md给人看moat-tasks-detail.json给 AI 看。两者不一致时以 JSON 文件为准点击侧边栏的 Refresh按钮从 JSON 重新生成 markdown旧版本升级时扩展会自动迁移老文件.moat-stream.jsonl等并打上.backup-时间戳后缀原数据不会删除见 migrateLegacyFiles.js3.3 任务 failed 了怎么重试任务在yolo模式下执行失败时打开.moat/moat-tasks-detail.json把对应任务的status改回to do再跑一次bridge即可重试。状态生命周期严格为to do → doing → done见 bridge.md。四、症状 3AI 说「找不到文件」怎么办AI 报 No Drawbridge tasks found 时按它的查找优先级逐项核对定义在 bridge.md.moat/moat-tasks-detail.json项目根目录moat-tasks-detail.json根目录旧版位置../.moat/moat-tasks-detail.json上一级目录4.1 目录不对先确认工作目录最常见的原因你在src/子目录里打开了编辑器。先cd到项目根目录确认.moat/就在那里。4.2 规则模板没部署重连一次就好扩展连接项目时会自动把 rules-templates/ 里的模板部署进.moat/。如果模板缺失AI 不知道去哪读任务——重新连接项目即会自动修复。4.3 Cursor 里bridge命令不灵用显式指令如果bridge命令跑不起来换成更明确的说法来自 README.md 官方建议use drawbridge-workflow.mdc to process moat-tasks.mdc4.4 提示「空任务列表」怎么办如果显示 No pending tasks found说明文件存在但全是done或还没创建批注——回到浏览器按f或C进入标注模式点选元素写评论任务会自动出现在.moat/moat-tasks.md。五、其他高频问题速查表现象原因解决办法Element not found标注后页面结构变了重新标注该元素批注框抖动还有未完成的批注先提交或取消当前批注Dependency Error任务顺序有依赖冲突查看 AI 分析给出的正确执行顺序扩展不生效未连接项目按Cmd/CtrlShiftP连接并允许文件访问权限侧边栏不见了被折叠点扩展图标或按Cmd/CtrlShiftF截图时页面卡顿html2canvas 同步解析 DOM参考 PRD-native-screenshot-capture.md 的captureVisibleTab原生方案 小贴士截图报错 Attempting to parse an unsupported color function lab 是旧版本问题已在 1.0.1 修复升级到 CHANGELOG.md 中的新版本即可。六、预防清单把问题挡在发生之前每个浏览器会话连接一次重启浏览器后先重连再开始标注别改名、别移动项目目录目录句柄会因此失效一个标签页对应一个项目多标签多项目时逐一连接标注要具体「字体改成 sans-serif」优于「改字体」AI 更不容易跑偏收藏本地开发地址减少重新寻找项目的成本相关文档官方说明与故障排查README.md、chrome-extension/README.md架构与连接生命周期chrome-extension/ARCHITECTURE.md连接后自动生成的项目内指南chrome-extension/rules-templates/README.mdAI 命令规则chrome-extension/rules-templates/bridge.md按上面的顺序排查先确认连接 → 再核对任务文件 → 最后检查 AI 的目录与指令绝大多数 Drawbridge 问题都能在三分钟内解决。赞分享【免费下载链接】drawbridgeDesign editor for Claude Code and Cursor. Figma Comments for the browser, are sent directly to Claude Code and Cursor as prompts.项目地址https://gitcode.com/gh_mirrors/drawbridge1/drawbridge点击查看免费下载相关推荐配额查不到怎么办opencode-quota常见问题排查清单与/quota_status诊断法配额查不到怎么办opencode quota常见问题排查清单与/quota_status诊断法 opencode quota 是一款专为 OpenCode 打下载失败、latent形状不匹配怎么办libero4in1_wan2.2vae_latent_cosmos_style常见问题排查清单下载失败、latent形状不匹配怎么办libero4in1_wan2.2vae_latent_cosmos_style常见问题排查清单 libero4i有道云笔记本地备份终极指南3步实现数据安全掌控有道云笔记本地备份终极指南3步实现数据安全掌控 在数字化笔记时代数据安全是每个用户最关心的问题。youdaonote pull作为一款专业的有道云笔记备份工开发工具CLI上一篇J4rs实现Java与Rust之间的无缝交互下一篇系统设计面试模拟awesome-system-design压力测试终极指南创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考