VS Code 中聊天功能的入门

本教程将引导你利用 Visual Studio Code 中的聊天功能。你将使用 AI 驱动的聊天对话来帮助重构代码、提高代码理解能力和熟悉 VS Code 的配置。

假如你是 VS Code 中 Copilot 的新用户，请参阅 ，或在 中进行设置并領會主要功能。

先决条件

要在 VS Code 中使用 GitHub Copilot，你需要满足以下条件：

• 拥有 GitHub Copilot 访问权限


• 在 VS Code 中安装 GitHub Copilot 扩展

依照 中的步骤获取 GitHub Copilot 的访问权限并在 VS Code 中安装 Copilot 扩展。

开始你的第一次聊天对话

在本教程中，你将创建一个简单的 Node.js Web 应用法式。

1. 
   

   打开一个新的 VS Code 窗口。你将在后续步骤中创建一个新的工作区。

   
   


2. 
   

   从标题栏的“聊天”菜单中选择打开聊天，或利用键盘快捷键 ⌃⌘I (Windows、Linux Ctrl+Alt+I)。

   
   
   
   

   请注意，聊天视图在辅助侧边栏中打开。将聊天视图放在侧边可以让你在编写代码时继续对话。

   
   


3. 
   

   在聊天视图中，从聊天模式下拉菜单中选择提问。

   
   

   利用提问模式来询问有关编码和技术主题的问题、解释代码或集思广益。

   
   
   
   


4. 
   

   让我们询问一下流行的 Web 框架。在聊天输入字段中输入“最風行的 Web 框架是什么？”。

   
   

   VS Code 返回一个風行 Web 框架的列表。尝试提出后续问题以获取有关特定框架的更多信息，或比较框架。例如，你可以问“Express 和 Fastify 有什么区别？”或“若何进行服务器端襯著？”。

   
   


5. 
   

   要搭建一个新的 Web 应用程序，请在聊天输入字段中输入“使用 TypeScript 和 Pug 创建新的 Express 应用法式”。

   
   

   请注意 VS Code 如何返回一个暗示新工作区文件的文件树。选择文件树中的任何文件以预览其内容。

   
   
   
   


6. 
   

   选择创建工作区以创建应用法式，并选择磁盘上应该创建工作区的文件夹。

   
   

   在对话框中选择打开以在 VS Code 中打开新创建的工作区。

   
   
   
   
   
   
   
   注意

   VS Code 可能会询问你是否信賴新的工作区。选择是，我信賴内容以信賴工作区。获取有关 的更多详细信息。

   
   

利用行内聊天連結工作流畅

虽然聊天视图十分适合連結对话，但编辑器行内聊天针对你進展向 Copilot 询问你正在编辑器中积极处理的代码的情况进行了优化。例如，重构特定代码片斷，或解释复杂算法。

让我们看看若何利用编辑器行内聊天进行代码重构。

1. 
   

   打开app.ts文件，并使用键盘快捷键 ⌘I (Windows、Linux Ctrl+I) 调出行内聊天。或，从标题栏的“聊天”菜单中选择打开行内聊天。

   
   

   一个聊天输入字段会出现在编辑器中，你可以在個中输入聊天提醒并向 Copilot 询问编辑器中的代码。

   
   
   
   


2. 
   

   在聊天输入字段中输入“添加对 JSON 输出的撐持”并按 Enter。

   
   

   请注意 Copilot 若何供應代码建议，以在 Express 中添加对 JSON 输出的支撐。

   
   
   
   


3. 
   

   选择接管或关闭以应用或忽略更改。

   
   

   如果你对建议的代码更改不满意，可以选择從新运行请求控件或提出后续问题以获取另外一个建议。

   
   

跨多个文件进行编辑

利用行内聊天，你对单个文件进行了更改。你还可以通过在聊天视图中切换到编辑模式来利用 Copilot 对工作区中的多个文件进行更改。

让我们使用编辑模式来利用.env文件存储 Web 应用法式的設置裝備擺設。

1. 
   

   打开聊天视图，从聊天模式下拉菜单中选择编辑。

   
   
   
   


2. 
   

   为了帮助 Copilot 理解你的请求范围，让我们将package.json和app.ts作为上下文添加到提示中。

   
   
   
   
   1. 
      

      在聊天视图中选择添加上下文，在搜刮字段中键入package，然后从文件列表中选择package.json文件。请注意，你可以添加许多类型的上下文。

      
      
   
   
   2. 
      

      在编辑器中打开app.ts文件，并注意 Copilot 自动将活动文件添加到聊天上下文中。

      
      
   
   
   
   


3. 
   

   在聊天输入字段中输入“利用 .env 文件进行設置裝備擺設”并按 Enter。

   
   


4. 
   

   请注意 Copilot 若何跨多个文件进行更新，并向你的工作区添加一个新的.env文件。

   
   

   聊天视图中用粗体文本显示了已更改的文件。

   
   
   
   


5. 
   

   在聊天视图中选择保存以确认所有建议的更改。

   
   

   利用编辑器中的覆盖控件可以轻松导航和审查文件中各个更改。

   
   

启动代辦署理编码流程

对于更复杂的请求，你可以使用代辦署理模式让 Copilot 自立规划和执行完成请求所需的任务。这些任务可以觸及编辑代码，也能夠包括在终端中运行饬令。在代辦署理模式下，Copilot 可能会调用分歧的工具来完成任务。

让我们利用署理模式将 Web 应用法式变成一个分享觀光提醒的应用法式并添加测试。

1. 
   

   打开聊天视图，从聊天模式下拉菜单中选择代辦署理。

   
   
   
   


2. 
   

   在聊天输入字段中输入“将应用法式变成一个觀光博客。添加测试以免代码回归。”并按 Enter。

   
   

   请注意，你不需要向提醒添加上下文。代理模式会自动闡發工作区中的代码。

   
   


3. 
   

   Copilot 迭代应用代码更改并运行测试等命令。通过在聊天视图中选择继续来确认终端敕令。

   
   
   
   

   根据请求的复杂性，Copilot 可能需要几分钟才能完成所有任务。若是在此过程中碰到问题，它会迭代修复它们。

   
   


4. 
   

   一旦 Copilot 完成任务，请审查更改并测试应用程序。

   
   

   你还可以通过向 Copilot 给出诸如“运行应用程序”或“启动服务器”之类的提示来要求它运行应用法式。

   
   

恭喜

恭喜，你已成功在 VS Code 中利用 Copilot Chat 提问并对工作区中的代码进行编辑。继续尝试分歧的提醒和聊天模式，以充分操縱 Copilot Chat。

其他资源