前端验收这件事，说起来容易做起来难。很多人验收时，往往只丢下一句"样式一致"、"功能正常"，结果上线后问题百出，反复返工。实际上，真正可落地的验收标准，必须精确到CSS选择器、状态、像素值、触发条件、校验方式这五个要素，能通过截图比对、DOM检查或颜色检测来一一验证，缺一不可。
你需要一套能在Trae里直接生成的验收标准，不是为了应付差事，而是真正能用于开发自测、QA回归、上线前核验。那么，具体该怎么做？
用原子化视觉锚点锁定UI细节
回到设计稿本身。打开Figma，在每个需要验收的组件旁边，手动标注【CSS选择器+像素级属性+触发时机】三要素。举个例子，登录按钮的悬停效果，不能简单写"悬停时颜色变蓝"，而要写成"button.login-btn:hover → background:#007bff → border-color:#0056b3 → transition:all 0.2s ease"。关键在这里：CSS选择器必须精确到class层级，别用"登录按钮"这种语义描述，否则Trae生成的验收项根本无法映射到实际的DOM节点。
另外要注意，Figma自动导出的选择器常常带着随机哈希，必须人工替换为项目真实的class名。否则，哪怕验收标准写得再漂亮，也只是一堆废纸。
做完标注后，拍照或转成文字，连设计稿链接一起喂给Trae，开头加一句提示："请按以下原子化锚点生成验收标准，每条必须含选择器、状态、像素值、触发条件、校验方式五项。"
按平台语气改写验收提示词
不同平台对Bot消息的"口味"差别很大，得根据平台调整语气。
先确认你要发消息的平台：飞书喜欢轻快、带emoji的句式；钉钉偏好稳重、主谓宾结构；企业微信则偏中性、正式。打开该平台已上线Bot的消息截图，观察通知类消息是否带emoji、动词偏好（比如飞书爱用"搞定啦～"，钉钉倾向"请您上传…"）。
飞书风格
原提示："页面验收已完成。" → 改为："✅ 页面验收搞定啦～"
原提示："校验失败，请检查配置。" → 改为："⚠️ 配置有点小问题，点这里快速定位 ?"
特别注意：禁止连续使用两个以上感叹号或省略号，否则会被判定为非专业Bot行为。
钉钉风格
原提示："请上传截图。" → 改为："请您上传页面截图，我们将立即进行人工复核。"
原提示："等待中…" → 改为："系统正在同步校验中，请您稍候。"
不管哪个平台，消息首行都必须明确标注触发动作来源，例如："【Trae前端验收】页面校验结果"。缺少来源标识的消息，在钉钉和企业微信中容易被折叠或归入"其他消息"，这就白费功夫了。
让AI先输出判断标准再生成清单
这一步很关键，别急着让AI直接生成清单。
第一步：在Trae对话框中输入以下提示词（一字不改）：
"请严格分两步响应：① 先用'【判断标准】'为标题，只列出4条用于判定本验收清单是否合格的核心标准；每条标准必须含具体文件名、命令、路径、端口、HTTP状态码或时间戳等可核查要素，禁止出现'确保''确认''检查'等动词开头；② 再用'【验收清单】'为标题，逐项对应上述标准生成带□符号的可勾选项。现在只输出第一步。"
第二步：拿到AI输出的4条标准后，立刻做三道卡口验证：
① 每条是否能转成一行可执行命令？比如"/dist/index.html中包含"，可直接用grep -q '' /dist/index.html验证；
② 是否全部避开了主观形容词？如"关键按钮""主流程区域"属于禁用词，必须替换为具体ID或class名；
③ 是否覆盖渲染前、交互中、异常后三个时段？缺任一时段，就会漏掉骨架屏加载、表单提交loading态、网络断连浮层等关键验收点。
第三步：补全隐含前提。只需回复："补充一条硬约束：所有标准必须基于当前Jira ID PROJ-8721关联的构建产物sha256校验值(d3a7f2b1…)和CDN域名cdn.example.com。"
绑定状态与交互的可截图断言
在提示词开头，直接列出所有需要校验的状态名，以及它们在界面上的唯一视觉标识。例如："登录态 → 右上角显示用户名+退出按钮；未登录态 → 显示'登录'和'注册'文字链接，无头像图标"。状态名必须与前端代码中实际使用的状态变量名完全一致，比如 useAuthStore().isLogin，而不是笼统写'已登录'。
交互动作必须用"当X→Y"句式来描述可截图变更。例如："当用户点击'提交'按钮 → 表单区域应立即禁用所有输入框，并出现加载中旋转图标；3秒后若接口返回成功 → 显示绿色Toast提示'提交成功'，且URL变为 /success。"
对于异步反馈，要做分层断言：第一步验证loading态是否出现（防止假成功），第二步验证最终态是否符合业务规则（比如跳转后页面标题包含"订单号"字样）。禁止出现"页面应该有反应"这类无法截图存证的描述。 这才是验收标准应有的样子。