在 VS Code 中开始使用 Copilot Chat
本教程将引导您如何在 Visual Studio Code 中使用 Copilot Chat。您将通过 AI 驱动的聊天对话来帮助重构代码、提高代码理解能力以及配置 VS Code。
如果您是 VS Code 中 Copilot 的新用户,请参阅Copilot 概述,或在Copilot 快速入门中进行设置并发现主要功能。
如果您还没有 Copilot 订阅,可以通过注册Copilot 免费计划免费使用 Copilot,并获得每月完成量和聊天交互的限制。
先决条件
要在 VS Code 中使用 GitHub Copilot,您需要具备以下条件:
- 访问 GitHub Copilot
- 在 VS Code 中安装 GitHub Copilot 扩展
按照GitHub Copilot 设置指南中的步骤,获取 GitHub Copilot 访问权限并在 VS Code 中安装 Copilot 扩展。
首次聊天对话
Copilot Chat 允许您使用自然语言与 GitHub Copilot 交互,提出和接收与编码相关问题的答案。
在本教程中,您将创建一个简单的 Node.js Web 应用程序。
-
打开一个新的 VS Code 窗口。您将在后续步骤中创建一个新的工作区。
-
从标题栏中的 Copilot 菜单中选择打开聊天,或使用键盘快捷键⌃⌘I (Windows, Linux Ctrl+Alt+I)。
请注意,聊天视图在第二侧边栏中打开。将聊天视图放在侧边栏可以让您在处理代码时保持对话进行。
-
在聊天视图中,从聊天模式下拉菜单中选择询问。
使用询问模式向 Copilot 提问编码和技术主题、解释代码或构思想法。
-
让我们向 Copilot 询问流行的 Web 框架。在聊天输入字段中输入“最流行的 Web 框架有哪些?”。
Copilot 返回了流行 Web 框架的列表。您可以尝试提出追问以获取特定框架的更多信息,或比较框架。例如,您可以问“Express 和 Fastify 有什么区别?”或“如何进行服务器端渲染?”。
-
要构建一个新的 Web 应用程序,请在聊天输入字段中输入“使用 TypeScript 和 Pug 的新 Express 应用程序”。
请注意 Copilot 如何返回表示新工作区文件的文件树。选择文件树中的任何文件以预览其内容。
-
选择创建工作区以创建应用程序,并选择磁盘上应创建工作区的文件夹。
在对话框中选择打开,以在 VS Code 中打开新创建的工作区。
注意VS Code 可能会询问您是否信任新工作区。选择是,我信任内容以信任工作区。获取有关工作区信任的更多详细信息。
通过内联聊天保持流畅工作
虽然聊天视图非常适合保持对话,但编辑器内联聊天经过优化,适用于您想要向 Copilot 询问编辑器中正在处理的代码的情况。例如,重构特定代码或解释复杂算法。
让我们看看如何使用编辑器内联聊天进行代码重构。
-
打开
app.ts
文件,并使用键盘快捷键⌘I (Windows, Linux Ctrl+I)调出编辑器内联聊天。或者,从标题栏中的 Copilot 菜单中选择编辑器内联聊天。一个聊天输入字段会出现在编辑器中,您可以在其中输入聊天提示,并向 Copilot 询问编辑器中的代码。
-
在聊天输入字段中输入“添加 JSON 输出支持”,然后按Enter。
请注意 Copilot 如何提供代码建议,以在 Express 中添加 JSON 输出支持。
-
选择接受或关闭以应用或忽略更改。
如果您对建议的代码更改不满意,可以选择重新运行请求控件或提出追问以获取另一个建议。
右键单击编辑器并选择Copilot上下文菜单,以访问常用的 Copilot 命令,例如修复或解释代码或生成测试。
跨多个文件进行编辑
通过内联聊天,您对单个文件进行了更改。您还可以通过切换到聊天视图中的编辑模式,使用 Copilot 对工作区中的多个文件进行更改。
让我们使用编辑模式,使用.env
文件来存储 Web 应用程序的配置。
-
打开聊天视图,然后从聊天模式下拉菜单中选择编辑。
-
为了帮助 Copilot 理解您的请求范围,让我们将
package.json
和app.ts
作为上下文添加到提示中。-
在聊天视图中选择添加上下文,在搜索字段中键入
package
,然后从文件列表中选择package.json
文件。请注意,您可以添加多种类型的上下文。 -
在编辑器中打开
app.ts
文件,请注意 Copilot 会自动将活动文件添加到聊天上下文中。
-
-
在聊天输入字段中输入“使用 .env 文件进行配置”,然后按Enter。
-
请注意 Copilot 如何跨多个文件进行更新,并向您的工作区添加一个新的
.env
文件。聊天视图中以粗体文本显示了已更改的文件。
-
在聊天视图中选择保留以确认所有建议的更改。
使用编辑器中的叠加控件,可以轻松导航和查看文件中的各个更改。
启动代理编码流程
对于更复杂的请求,您可以使用代理模式让 Copilot 自主规划和执行完成请求所需的任务。这些任务可以涉及编辑代码,也可以包括在终端中运行命令。在代理模式下,Copilot 可能会调用不同的工具来完成任务。
让我们使用代理模式,将 Web 应用程序变成一个分享旅行攻略的博客,并添加测试。
-
打开聊天视图,然后从聊天模式下拉菜单中选择代理。
-
在聊天输入字段中输入“将应用程序变为旅行博客。添加测试以避免代码回归。”,然后按Enter。
请注意,您无需向提示添加上下文。代理模式会自动分析工作区中的代码。
-
Copilot 迭代以应用代码更改并运行测试等命令。通过在聊天视图中选择继续来确认终端命令。
根据请求的复杂性,Copilot 可能需要几分钟才能完成所有任务。如果在此过程中遇到问题,它会迭代修复它们。
-
一旦 Copilot 完成任务,请审查更改并测试应用程序。
您还可以通过给出“运行应用程序”或“启动服务器”之类的提示,要求 Copilot 运行应用程序。
恭喜
恭喜您,您已成功在 VS Code 中使用 Copilot Chat 来提问并跨工作区编辑代码。继续尝试不同的提示和聊天模式,以充分利用 Copilot Chat。