ARTICLE · 996773
和 AI 协作造工具,我最常踩的 6 个坑(文末送你 1 个彩蛋)
和 AI 协作造工具,我最常踩的 6 个坑(文末送你 1 个彩蛋)
用 AI 造工具，最大的错觉是"它写完了 = 能用"。真实情况是：AI 给你的永远是骨架，骨架能跑 ≠ 产品能用。从骨架到能天天用的工具，中间全是坑。我把踩过的最痛的 6 个，按"发生频率 × 破坏力"排了个序。
现象：我第一版只说"做个待办"，AI 给了一堆花哨按钮，核心的"逾期标红""筛选记住"反而没有。 血泪：浪费了第一个迭代周期在删多余功能上。 怎么避：
现象：某次让 AI 改甘特图布局，它顺手动了顶层 JS，结果整个页面打不开——白屏。 血泪：那次差点丢了两天的心血。后来我立了规矩：每次大改前先备份（导出 JSON / 复制一份 HTML），改完验证再继续。 怎么避：
现象：从 V1 升到 V3，老数据结构变了，新版本读不出来会报错。 血泪：差点让用户（也就是我自己）的历史待办全没了。 怎么避：
现象：AI 为了"好看"，引了在线字体或图表库，本地双击打开就报错 / 样式崩。 血泪：工具的核心卖点是离线可用，被自己人（AI）背刺了。 怎么避：
现象：早期"删除"直接物理删除，手一滑，一条重要任务再也找不回。 血泪：那次是写周报要用的一条关键任务，找了一下午。 怎么避：
现象：AI 说"好了"，你打开发现标签没闭合、JS 有语法错、示例数据不显示。 血泪：反复来回，沟通成本比写代码还高。 怎么避：
说好送你一个彩蛋——它不是坑，是我后来玩出来的一个"意外收获"。 工具做完后，我把它发布到了资料库（没错，就是前文里提到的二维码扫码打开的内容）。问题来了：我怎么知道有多少人打开过它、大概停留了多久？我不想为了这一个数字去接一套统计系统，于是让 AI 在页面里塞了一段"轻量打卡"逻辑，原理很简单： 思路：发布环境的平台会向页面注入一个小工具（SDK）。页面打开时，就往你建好的一张"访问记录"表里写一条：进入时间、来源网页；停留期间每隔一段时间更新一次"停留时间"；离开时补上退出时间。再数一数"来源网页 = 我"一共有多少条，就是累计打开次数。 关键点有三个： 给你看一眼核心代码的样子（看懂思路就行，我写的是简化版）： 这段逻辑跑起来后，我就能在数据表里看到：工具被打开过多少次、平均停留多久、每天几点来的人多。对做内容、做资源分享的人来说，这两个数比什么都实在——你知道自己发出去的东西，到底有没有人真的在用。 这个"打卡"逻辑我也让 AI 写进了提示词模板里。
6 个坑，归结起来就一句话：AI 负责写，你负责定规矩和兜底。你越是把"约束、边界、验收"写清楚，它越不会把你带进沟里。 我那个工作台能跑到现在（最新更新到V4），不是因为我聪明，是因为我踩够了坑、又把每个坑都写成了规则。 如果这篇帮到了你，或者你也有想补充的坑，评论区告诉我。 还没拿到工作台和提示词的，后台回复「工作台」就能领，先拿到手再对照这篇避坑，印象最深。
上两篇讲了《12 天 120 条需求》和《开源提示词》。这篇是血泪版——那些让我改到凌晨、差点把数据搞丢的坑，希望你别再踩。文末还有一个彩蛋：怎么让你的工具知道自己被打开过多少次。
先说结论
坑 1：需求太模糊，AI 自作主张
把"我想要 X"翻译成"X 应该这样"——具体的行为、状态、字段； 在提示词里写**"不要什么"**和"要什么"同等重要。比如我后来强制写「禁止引入 CDN / 框架」，否则它会顺手引个 Bootstrap，离线能力当场报废； 需求拆成清单，按功能归类，逐条对 AI 派活，而不是扔一句话。
坑 2：改崩了，没有备份
改前备份，改后验证，一步一停； 用版本化的文件命名（v1 / v2 / v3），别覆盖； 让 AI 改局部时，要求它只改指定函数、不要动其他模块（"只改 taskColor 函数"比"优化一下样式"安全得多）。
坑 3：数据不兼容，升级即丢失
在提示词里写死「旧数据结构自动补齐缺省字段」——AI 会在读取时容错； 版本号字段 + 迁移逻辑，老数据进新版本自动补默认值； 这个习惯让我 V1 的数据在 V3 里无缝加载，这是"自己造工具"比"用别人产品"最大的安全感。
坑 4：离线能力被悄悄破坏
全局约束：「零外部依赖，所有 SVG 图标手写，字体用系统栈」； 交付前自检清单里加一条「断网打开是否正常」； 不在代码里出现 http(s):// 之外的任何外链资源。
坑 5：删数据不设防，一删全没
改用软删除：删除进「已删除」折叠区，可恢复； 清空 / 删除类操作一律二次确认； 关键操作前弹窗说清风险，再执行。
坑 6：没有验收清单，质量靠玄学
在提示词输出要求里塞一份自检清单：标签闭合、JS 无语法错误、移动端不溢出、localStorage 正常、示例数据（含 1 条逾期）能展示； 让 AI 交付时逐条自查，并附「功能清单」注释； 你拿到后也跑一遍清单，别全信。
🎁 彩蛋：发布到资料库的 HTML，怎么知道被打开过多少次
本地打开不打扰：SDK 只在平台发布环境注入，本地双击 HTML 时它不存在，代码检测到就自动跳过——不会弹错，也不影响离线使用； 停留时间只算"真的在看"：页面切到后台（比如锁屏、切 App）就暂停计时，回到前台继续累加，这样数字才是真实停留时长，而不是挂机时长； 靠"来源网页"区分自己：给每条记录打上你的页面标记，统计时只数自己的，不会把别人页面的访问混进来。
// 1) 平台发布环境会注入 window.__SMART_PAGE__.database；本地打开没有 → 直接跳过var db = window.__SMART_PAGE__ && window.__SMART_PAGE__.database;if(!db) return;// 2) 打开页面 → 写一条进入记录，标记来源db.addRecord({ databaseId: ”你的数据表ID”, properties: {”进入时间”: { date: new Date().toISOString() },”来源网页”: { text: ”办公工作台” } // 改成你的页面名}});// 3) 每隔 30 秒，把”前台可见”的时长更新进记录（后台期间不计）setInterval(function(){db.updateRecord({ databaseId: ”你的数据表ID”, recordId: 当前记录,properties: { ”停留时间”: { number: 已累计秒数 } } });}, 30000);// 4) 想数次数？查一下”来源网页 = 我”共有多少条，就是累计打开数db.query({ databaseId: ”你的数据表ID”, filter: { 来源网页: ”办公工作台” } })