--- 
name: verify-frontend-change 
description: 在宣告完成之前端到端验证任何 UI 变更。 
--- 
# 验证前端变更 
永远不要仅凭成功的代码编辑就报告 UI 变更已完成。像人类评审员那样去验证它： 
1. 启动开发服务器并在浏览器中打开被修改的页面。 
2. 直接与变更进行交互。对于新的控件（按钮、输入框、开关）：
   点击它，确认预期的状态变化，并截图对比前后效果。 
3. 检查浏览器控制台：不能有任何新的错误或警告。 
4. 使用 Chrome Devtools MCP，运行性能追踪并审计 Core Web Vitals。
如果任何步骤失败，修复问题并从步骤 1 重新开始
——不要交还部分验证的工作。

基于目标的循环（Goal-based loop） — /goal

触发方式：手动实时输入的提示词

停止条件：目标达成，或达到最大轮次数

最佳适用场景：具有可验证退出条件的任务

管理用量的方式：设定具体的完成标准和明确的轮次上限，例如"5 次后停止"

有时候，一轮是不够的，尤其对于更复杂的任务。Agent 在能够迭代的时候表现更好。你可以通过 /goal 定义"完成长什么样"来延长 Claude 持续迭代的时间

当你定义了成功标准，Claude 就不需要自己判断什么是"够好了"然后提前结束循环。每次 Claude 试图停下时，一个评估模型会检查你的条件，然后把它送回去继续工作，直到目标达成或你定义的轮次数用完

这就是为什么确定性标准——比如测试通过数量或达到某个分数阈值——如此有效

例如：

/goal 把首页的 Lighthouse 分数提高到 90 或以上，5 次后停止。

基于时间的循环（Time-based loop）— /loop 和 /schedule

触发方式：指定的时间间隔

停止条件：你取消它，或者工作完成（PR 合并了，队列清空了）

最佳适用场景：重复性工作，或与外部环境/系统的对接

管理用量的方式：设置更长的间隔，或基于事件而非时间来响应

有些 Agent 工作是重复性的：任务不变，只是输入变了。例如，每天早上总结 Slack 消息。还有些工作依赖外部系统，一种简单的对接方式是按照一定间隔去检查它，然后对变化做出反应。例如，一个可能收到代码评审或 CI 失败的 PR

对于这些情况，你可以用 /loop 来触发 Claude 运行，它会按照一个间隔重复执行某条提示词。例如：

/loop 5m 检查我的 PR，处理评审意见，修复失败的 CI

/loop 在你的电脑上运行，所以如果你关机了，它就停了。你可以通过 /schedule 创建一个例行任务，把循环移到云端

主动循环（Proactive loops）

触发方式：由事件或计划触发，无需人类实时参与

停止条件：每个任务在目标达成时退出。例行任务本身会一直运行直到你关闭它

最佳适用场景：重复性的、定义明确的工作流：Bug 报告、Issue 分类、迁移、依赖升级等

管理用量的方式：将例行任务路由到更小更快的模型，关键判断使用最强大的模型

上述的原语，加上 Claude Code 的其他功能如 Auto 模式 和 动态工作流（Dynamic Workflows）（研究预览），可以组合成一个用于长期运行工作的循环

例如，要处理传入的反馈，你可以使用：

1. /schedule（研究预览）运行一个检查新报告的例行任务
2. /goal 定义完成长什么样，Skills 记录如何验证
3. 动态工作流 编排多个 Agent 对每个报告进行分类、修复和评审
4. Auto 模式 让例行任务运行时不需要停下来请求许可

把它们放在一起，一条提示词可以是这样的：

/schedule 每小时：检查 #project-feedback 中的 bug 报告。
/goal：不要停下来，直到本次运行发现的每个报告都已分类、处理和回复。
修复 bug 时，使用工作流在并行工作树中探索三个方案，
并让一个评审者对它们进行对抗性评审。

保持代码质量循环输出的质量取决于它周围的系统。在设计系统时：

保持代码库本身的整洁：Claude 会遵循代码库中已有的模式和约定。

给 Claude 一种验证自身工作的方式：用 Skill 编码你和你的团队对"好"的定义。

让文档触手可及：框架和库的文档包含最新的最佳实践。

使用第二个 Agent 做代码评审：拥有全新上下文的评审者偏见更少，不会受到主 Agent 推理的影响。你可以使用内置的 /code-review Skill 或 Code Review for Github。

当某个结果不符合标准时，不要止步于修复单个问题——尝试将其编码化，以改进系统在所有未来迭代中的表现

管理 Token 用量为了管理 Token 用量，循环应该有清晰的边界：

为任务选择合适的原语和模型：较小的任务不需要多个 Agent 或循环。有些任务可以使用更便宜更快的模型。

定义明确的成功和停止标准：具体说明完成长什么样，这样 Claude 可以更快地到达解决方案（但不能太快）。

大规模运行前先小范围试跑：动态工作流可以生成数百个 Agent。先在一小部分工作上评估用量。

确定性工作用脚本：运行脚本比推理每个步骤更便宜。例如，一个 PDF Skill 可以附带一个表单填写脚本让 Claude 每次运行，而不是每次重新推导代码。

不要比需要的更频繁地运行例行任务：让间隔匹配你监控的东西变化的频率。

查看用量：/usage 命令按 Skill、子 Agent 和 MCP 分解最近的用量，不带参数的 /goal 显示目前的轮次数和 Token 用量，/workflows 显示每个 Agent 的 Token 用量，你可以随时停止某个 Agent。

总结一下：

基于轮次 — 交出：验证检查 ／ 何时使用：你在探索或做决策 ／ 使用：自定义验证 Skill

基于目标 — 交出：停止条件 ／ 何时使用：你知道完成长什么样 ／ 使用：/goal

基于时间 — 交出：触发时机 ／ 何时使用：工作按计划在你的项目之外发生 ／ 使用：/loop、/schedule

主动循环 — 交出：整个提示词 ／ 何时使用：工作是重复性且定义明确的 ／ 使用：以上所有，加上动态工作流

要开始使用循环，看看你已经在做的工作。挑一个你是瓶颈的任务，问问自己哪部分可以交出去：你能写验证检查吗？目标够清晰吗？工作是按计划到来的吗？

一旦有了想法，运行循环，观察结果——比如它在哪里卡住了或做过头了——不要害怕对它进行迭代

更多信息请阅读 Claude Code 文档中关于并行运行 Agent、以及 loop、schedule、goal 和动态工作流的页面

英文原文来自Claude code 官方博客

往期文章：

能写代码却上不了网？一句话「解封」你的 AI Agent，刷B站、搜小红书

日行一善，你奶奶都能学会的 Hermes 教程，免费，开源

登录查看剩余 70% 内容