AI News
官方更新 GitHub Blog AI/ML Thu, 10 Sep 2026 正文 ok 532 words

GitHub Copilot app 新手指南：使用差异视图、终端和浏览器

英文标题：GitHub Copilot app for Beginners: Using the diff, terminal, and browser

GitHub 介绍了 Copilot app 中用于审查 Agent 生成代码的三个内置面板：差异视图、终端和浏览器预览。开发者可在同一会话中查看代码改动、运行项目命令并测试 Web 应用，无需在编辑器、终端和浏览器标签页之间切换。文章强调，开发者仍可决定接受、评论或要求修改代码，并可直接从 Copilot app 接受变更、创建 pull request。对于 AI 辅助开发而言，这套工作流有助于在合并前验证改动是否真正可运行、可用。
打开原文相关 3 · 机会 4
media75.6 KB media33.6 KB media84.8 KB media40.0 KB media60.5 KB media30.0 KB media127.1 KB media52.6 KB media77.9 KB media37.0 KB media70.2 KB media34.5 KB media84.0 KB media42.8 KB media583.0 KB media434.8 KB media11.0 KB media16.5 KB media72.2 KB media102.6 KB

中文

当 Agent 对你的代码作出修改时，你会希望审查它、运行它，并了解具体发生了哪些变化。好消息是：现在，你无需离开 GitHub Copilot app，就能完成这三件事。

过去，要完成这三项工作，意味着你必须在编辑器、终端窗口和 Web 浏览器之间来回切换。但当这些步骤以 Copilot app 内置面板的形式并排呈现时，检查 Agent 的工作就变得简单了。

下面我们将逐一了解应用中的各个面板，以及如何利用它们完成 AI 编程闭环。

使用差异视图面板审查变更

差异视图面板（diff，即变更前后的对比）会准确显示哪些代码行被新增、删除或修改：新增内容以绿色高亮，删除内容以红色高亮。

这让你能够完全了解情况，从而决定下一步操作。你可以接受变更、留下评论，或要求 Copilot 作出修改。你始终拥有完全控制权，并作出最终决定。

在终端面板中运行命令

阅读代码很好，但实际运行它更好。你可以直接在 Copilot app 的终端面板中、在当前会话内运行命令。如果这看起来有些令人望而生畏，也不必担心：大多数时候，你只是运行项目自身的命令并查看结果。

你可以手动运行代码，也可以将其配置为脚本（可通过 Run 按钮使用）。假设你正在开发一个网站，下面是其工作方式示例：

  • 添加 dev server 脚本，该脚本会打开客户端文件夹，然后运行 npm run dev。
  • 点击 Run，启动网站服务器。

你可以同时打开多个终端窗口，因此能够在它们之间切换并持续运行命令。

对于任何带有用户界面的内容，浏览器面板将闭合整个工作流程。以我们的网站示例来说：借助这个面板，你可以打开网站，并像真实用户一样测试新功能。

如果你希望继续迭代，可以使用 Pick & Polish 工具选中某个元素，再通过 Agent 对其进行调整。

为了查看哪些问题已被修复，你可以在完成变更后再次运行 dev server 脚本。

完成 AI 代码审查闭环

现在，你已经审查了差异、在终端中启动了项目、在浏览器中检查了项目，并通过迭代将其完善为可用功能。当结果达到你的预期后，可以直接在 Copilot app 中接受变更并创建 pull request。在一个地方完成这一闭环，意味着无需在标签页间跳转、切换应用，或丢失当前工作位置。

将审查、运行和预览并排放置，正是让 Agent 生成的变更从令人担忧变得可靠的关键：因为你可以证明即将合并的内容确实能够正常工作。

请记住这些要点

这些内置面板回答了在接受 Agent 工作成果前，始终应当提出的三个重要问题。

  • 改了什么？
  • 能运行吗？
  • 它 真的**** 能正常工作吗？

在接受 Agent 生成的代码前，逐项检查这份清单，能够帮助你理解发生了哪些变更，以及代码是否按你希望的方式运行，从而始终保持控制权。✨

作者

高级 AI 开发者工具倡导者

English / 原文

When an agent makes a change to your code, you want to review it, run it, and see what changed. Great news: now you can do all three without having to leave the GitHub Copilot app.

Before, doing those three jobs would mean having to bounce between your editor, terminal window, and web browser. But when these steps live side by side as built-in panels in the Copilot app, checking your agent’s work is simple.

Let’s walk through each of the panels in the app and how we’ll use them to complete the AI coding loop.

Using the diff panel to review changes

The diff panel (a diff is a before and after comparison) shows exactly what lines were added, removed, or changed, with additions highlighted in green and deletions in red.

This gives you complete clarity, so you can choose what happens. You can accept changes, leave comments, or ask Copilot to make changes. You’re in complete control and make the final decisions.

Running commands in the terminal panel

Reading code is good, but running it is even better. You can run commands right inside the session from the Copilot app’s terminal panel. And if it looks intimidating, don’t worry. You’re mostly just running the project’s own commands and reading the results.

You can run the code by hand or configure it as a script (available through the Run button). Pretend you’re working on a website, here’s an example of how that works:

  • Add the dev server script that opens the client folder and then runs npm run dev.
  • Click Run to start the server for the website.

You can have multiple terminal windows open at once, so you can switch between them and keep running commands.

For anything that has a user interface, the browser panel closes the loop. And for our website example: this panel means you can open it and test your new feature as if you were using the site.

If you want to keep iterating, you can use the Pick & Polish tool to select an element and adjust it with the agent.

And to see what got fixed, you can run the dev server script again after you’ve made changes.

Closing the loop of reviewing AI code

Now you’ve reviewed the diff, started the project in the terminal, reviewed it in the browser, and iterated to get it to a working feature. Once you’ve gotten it where you want, you can accept the change directly from the Copilot app and create a pull request. Completing this loop from one place means there’s no tab hopping, switching apps, or losing your place.

Having review, run, and preview side by side is what makes agent-made changes feel safe instead of scary, because you can prove that what you’re merging works.

Take this with you

These built-in panels answer three important questions you should always ask before you accept an agent’s work.

  • What’s changed?
  • Does it run?
  • And does it actually**** work?

Running through this list before accepting agent-generated code will help you understand what changed and whether it functions the way you want, keeping you in control. ✨

Written by

Senior AI Developer Tools Advocate