作者：Kayla Cinnamon

排版：Alan Wang

检查智能体生成的代码，往往意味着需要在多个标签页之间来回切换。了解如何在 GitHub Copilot App 中查看代码 Diff、运行终端命令，以及并排预览 Web 应用，在一个界面内完成整个开发与验证流程。

当智能体修改了你的代码后，你通常需要检查改动、运行代码，并确认到底发生了什么变化。好消息是，现在你可以直接在 GitHub Copilot App 中完成这三件事，无需离开应用。

过去，要完成这些工作，你需要不断在编辑器、终端窗口和浏览器之间来回切换。而现在，这些能力都以内置面板的形式并排集成在 Copilot App 中，让检查智能体生成的代码变得更加简单、高效。

接下来，我们一起了解 App 中的几个核心面板，以及如何利用它们完成 AI 编码闭环。

使用 Diff 面板审查代码改动

Diff 面板（即代码变更前后的对比视图）会清晰展示哪些代码行被新增、删除或修改，其中新增内容以绿色高亮，删除内容以红色高亮。

它能够帮助你准确了解每一处改动，从而决定下一步如何处理。你可以接受修改、添加评论，或者要求 Copilot 继续调整代码。整个过程中，你始终拥有最终决定权。

在终端面板运行命令

阅读代码很重要，但真正运行代码更重要。

在 Copilot App 的终端面板中，你可以直接在当前会话里运行项目命令，无需切换到外部终端。如果终端看起来有些陌生，也不用担心——大多数情况下，你只是运行项目已有的命令，并查看执行结果。

你既可以手动输入命令，也可以将常用命令配置为脚本，通过 Run 按钮一键执行。

以一个 Web 项目为例，流程可能是这样的：

• 添加一个 dev server 脚本，进入客户端目录后执行 npm run dev。

• 点击 Run，启动网站的开发服务器。

你还可以同时打开多个终端窗口，在不同终端之间自由切换，并持续运行不同的命令。

在浏览器面板使用 Pick & Polish 工具

对于任何带有用户界面的项目，浏览器面板可以帮助你完成整个验证流程。

继续以网站项目为例，你可以直接在浏览器面板中打开应用，像真实用户一样测试刚刚实现的新功能。

如果还需要继续优化，可以使用 Pick & Polish 工具，直接选中页面中的某个元素，并让智能体对它进行调整或优化。

完成修改后，只需再次运行 dev server 脚本，就可以立即查看最新效果。

完成 AI 代码审查闭环

现在，你已经完成了整个流程：

• 在 Diff 面板审查代码改动；

• 在终端中启动并运行项目；

• 在浏览器中预览和测试功能；

• 根据测试结果继续迭代，直到功能达到预期。

当一切都符合你的要求后，你可以直接在 GitHub Copilot App 中接受这些修改，并创建 Pull Request。

整个闭环都在同一个应用内完成，无需频繁切换标签页、应用或开发环境，也不会打断当前的工作流程。

将代码审查、运行和预览放在同一个界面中，也让智能体生成的代码变得更加可靠——因为在合并之前，你可以亲自验证它确实能够正常工作。

带走这三个关键问题

在接受智能体生成的代码之前，GitHub Copilot App 的内置面板可以帮助你回答三个关键问题：

• 改了什么？

• 代码能运行吗？

• 功能真的按预期工作了吗？

在接受智能体生成的代码之前，按照这三个问题检查一遍，不仅能帮助你理解每一次改动，也能确认代码是否真正满足你的需求，让你始终保持对代码的掌控。

尝试使用 GitHub Copilot App >