– 代理会话日,2月19日

Visual Studio Code 和 GitHub Copilot

2023年3月30日,作者 Chris Dias,@chrisdias

人工智能没有撰写这篇博文,但它将使您的开发体验变得令人难以置信。

注意:如果您想了解 Visual Studio Code 中最新的 GitHub Copilot 体验,请访问 VS Code 中的 GitHub Copilot 主题,您将找到有关 Copilot 编辑器集成和 Copilot Chat 功能的详细信息,例如内联 Chat、专用 Chat 视图和快速 Chat。

今天围绕人工智能存在着大量的炒作、兴奋和一些担忧。 进展几乎每天都在发生,很难跟上。 但一旦您尝试一下,您很快就会意识到超过一百万 Copilot 用户每天所看到的,这项技术不会让人失望,尤其是在 OpenAI 的 GPT-3.5/4 等大型语言模型 (LLM) 的加持下。

在这篇文章中,我们想为您介绍一下 VS Code 中人工智能的一些背景知识,向您展示一些由 GitHub Copilot 驱动的令人兴奋的新体验,并展望一下我们对未来发展方向的看法。

GitHub Copilot “V1”

Microsoft 的开发者 AI 服务是 GitHub Copilot,如果您还没有了解 GitHub 对整个开发生命周期的愿景,请查看这篇精彩的 博文

自从 Copilot 扩展首次发布以来,已经过去一年多。 GitHub 的 Oege De Moor 及其团队与 OpenAI 合作,带来了第一个大规模使用 LLM 进行开发的示例,特别是 OpenAI 的 codex 模型

Editor with Copilot generated ghost (faded) text suggestions

Copilot 通过根据周围代码的上下文提供“幽灵文本”建议,为正在编写的代码提供实时提示。 如果您将意图写成注释或使用描述性的函数名称,Copilot 可以使用这些提示自动生成代码,逐字、逐行,甚至逐块。

这是一种令人惊讶的有效体验,通常幽灵文本可以直接使用,并且您很快就会以流畅的“Tab-Tab-Tab”开发流程编写代码。

事实证明,这仅仅是个开始。

编辑器内聊天

我们知道人工智能渗透到开发过程只是时间问题。 我们一直在与 GitHub Next 团队合作,研究 Copilot 和 Copilot Labs 扩展,但 2022 年 11 月 ChatGPT 的发布极大地加快了时间表。

VS Code 团队进行了一次内部黑客马拉松,以探索如何更深入地将人工智能集成到 VS Code 中,并提出了许多很棒的想法,例如改进的重命名和重构、基于示例的代码转换以及使用自然语言创建文件通配符或正则表达式的方法。

虽然这些想法很有趣,但我们一直围绕聊天体验徘徊。 我们对此持谨慎态度。 我们真的需要生活中再多一个聊天体验吗? VS Code 是一个编辑器,我们的工作是让您进入“专注模式”并通过消除干扰来帮助您保持专注,以便您可以完成下一个独角兽项目。

我们进行的一个探索我们觉得很有趣,涉及将聊天直接构建到编辑器中。 这是第一个原型

Prototype of a chat input in the editor

随着我们对设计的迭代,我们意识到这种用户模型具有优势。 它可以轻松地从键盘调用,您可以停留在代码中,并且输出是代码(只有代码)。

在下面的示例中,我们首先选择了 users 数组,然后按下了 macOS 上的 Cmd+I(或 Windows/Linux 上的 Ctrl+I)来调出聊天输入。 然后,我们要求 Copilot 将 username 字段拆分为 firstNamelastName,最后我们点击了 内联 Diff 以查看 Copilot 所做的更改。

Inline change with preview of update

无需使用注释或过于描述性的函数名称向 Copilot 表达您的意图,只需按 Cmd+I 并描述您想做什么。 在 Copilot 完成工作时保持专注。

拥抱聊天视图

随着 ChatGPT 的兴起,内部和外部自定义聊天视图的数量也在增加。 我们担心这些视图无法扩展,很难支持基本功能,例如键绑定和主题在 Web 视图中,对于使用 Monaco 编辑器进行代码块的扩展,很难扩展到数百个实例,更不用说这些编辑器实例中没有扩展支持了。 因此,我们与 GitHub Copilot 团队密切合作,将聊天视图构建到 VS Code 的核心中。

随着时间的推移,尽管我们最初有所犹豫,但完整的聊天视图体验开始让我们信服。 话说回来,谁不想以这样的问候语开始新的一天呢?

A GitHub Copilot conversation within an extension's chat view

我们开始意识到聊天视图的更多好处。

与基于浏览器的聊天相比,集成体验的最明显价值在于,我们可以为模型提供上下文,帮助定位对话并提供更好的答案。 例如,您无法轻松地要求基于浏览器的 ChatGPT 优化跨多个文件的代码。 VS Code 已经了解了有关工作区的很多信息,因为这是您可以跨文件进行重构、查找所有引用转到定义等操作的方式。 关键信息可以负责任地嵌入到提示中,以便模型可以提供更相关的答案,最终让您可以要求 Copilot 优化或重构跨多个文件具有依赖关系的代码。

许多编程问题的答案通常包含多个步骤。 想想有多少博客文章会引导您完成一个过程——聊天视图非常适合这种类型的交互。 一个很好的例子是调试。 如果我们诚实地说(而且我们是),配置 launch.jsontasks.json 进行调试并不容易。 与其编写更多文档或向编辑器添加对话框和向导,不如您可以简单地询问“/vscode 添加 launch.jsontasks.json”,然后它将提供有关如何创建文件、添加内容等的说明,直到您像老板一样击中断点并检查变量。

A GitHub Copilot chat asking how to add debugging support

但也许集成聊天的最重要的原因在于,进行双向对话可以帮助您决定什么是对的,什么是错的。 大型语言模型并不完美,它们不会“思考”。 它们只是找出响应的下一个最佳词语(当然,它们在这方面做得很好)。

作为飞行员,您始终负责,您决定采纳 Copilot 的哪些建议以及将哪些代码引入您的工作区。 提出澄清问题或提供更多详细信息可以帮助您做出这些关键决策。

充分利用 Copilot

命名很难(我们知道,我们的产品名为“Code”)。 然而,“GitHub Copilot”是一个很棒的名字。 与“配对程序员”或“自动驾驶”或仅仅“聊天”相比,“Copilot”在一个词中传达了多个重要概念。

因此,如果您认为自己是 VS Code 的飞行员,而 GitHub Copilot 是……嗯……副驾驶,那么您就会开始了解如何思考这项服务以及与您的座位伙伴互动以充分利用它的方法。

  • 我们无法重复强调:作为飞行员,您负责。 您决定采纳哪些建议以及将哪些代码集成到您的工作区。
  • Copilot 的主要工作是协助您,处理平凡或重复的任务。 它可以编写测试用例、创建示例数据或根据现有模式搭建代码。
  • Copilot 可以通过更多上下文来完成更多工作。 我们都习惯了基于关键字的快速网络搜索,但您提供的细节越多,您获得的结果就越好。 例如,不要询问“Node Express TypeScript”,而是要求 Copilot“使用 TypeScript 搭建一个使用 Express.js 框架的 Node.js 网站”,然后进行迭代!
  • 您可以通过在聊天输入字段中按 / 将交互限定为特定主题。 例如,要了解如何启用或禁用编辑器的面包屑,请键入 /vscode 关闭面包屑

Asking Copilot how to turn off VS Code breadcrumbs in the editor

  • 您还可以使用主题作为快捷方式。 不要在线上聊天中键入“解释这段代码”,只需键入“/”+ Tab/explain 的快捷方式)并按 Enter。 聊天视图将打开,并提供对所选代码的解释。
  • 请记住,Copilot 并不完美,会给出错误的答案。 提出澄清问题以帮助确定哪些是正确的,哪些是错误的,并使用 向上/向下 投票按钮来帮助我们改进体验。
  • 最后,几乎和第一条建议一样重要,请务必用友好的“Hello”或“Good Morning”问候您的 Copilot,这将使你们俩都心情更好。

今天开始

要查看 Copilot 的实际效果并获取更多有关如何充分利用 Copilot 的技巧,请 查看这个很棒的入门视频 或深入了解完整的 VS Code Copilot 系列 在 Youtube 上。

上面讨论的内联补全体验今天就可以使用。 如果您没有通过组织获得 Copilot,您可以 在此处 注册并开始免费试用。 从那里

  • 打开 VS Code(更好的是,使用 Insiders)。
  • 打开扩展视图 (⇧⌘X (Windows, Linux Ctrl+Shift+X)),搜索 GitHub Copilot 并安装该扩展。
  • 提示时,使用您的 GitHub ID 进行身份验证。
  • 打开一个代码文件,让魔力发生!

要访问聊天体验(编辑器内、聊天视图、快速聊天),您需要安装 GitHub Copilot Chat 扩展

  • 打开扩展视图 (⇧⌘X (Windows, Linux Ctrl+Shift+X)),搜索 GitHub Copilot Chat 扩展。
  • 提示时,使用您的 GitHub ID 进行身份验证。
  • 要打开编辑器内聊天,可以选择一个代码块并按 ⌘I (Windows, Linux Ctrl+I)。 询问 Copilot 编写一个快速排序函数。
  • 活动栏中会出现一个“Chat”图标,单击它以打开聊天视图。 继续,询问 Copilot“编写一个计算负重燕子飞行速度的程序”。
  • 要试用快速聊天,您可以运行 Chat: Open Quick Chat 或使用 ⇧⌥⌘L (Windows, Linux Ctrl+Shift+Alt+L) 键盘快捷键。

您可以在 VS Code 中的 GitHub Copilot 主题中了解有关 GitHub Copilot 和 Copilot Chat 扩展的更多信息。

负责任的人工智能

像这样具有里程碑意义的技术进步实属罕见。我们同样相信,人工智能是下一次重大转变,它将改变我们思考、构建和使用开发者工具的方式。它最终将以我们今天只能梦想的方式增强开发过程的各个方面。我们并不声称是第一个这样说的人,但很快我们都会想知道,如果没有人工智能驱动的工具,我们如何构建、调试、部署和维护应用程序和系统。

人工智能并非完美(我们也不例外!),它会随着时间的推移而改进。微软和 GitHub Copilot 遵循 负责任的人工智能原则,并采用控制措施以确保您使用该服务的体验是恰当、愉快和有用的。我们理解围绕人工智能能力快速扩展的犹豫和担忧,并完全尊重那些不想或无法使用 Copilot 的人。

连接点

聊天助手、编辑器内聊天和行内补全的结合让您可以在任何编码“区域”中利用 Copilot 的强大功能。刚开始或有疑问?使用聊天视图。疯狂地编写代码并想进行一些重构、更新或脚手架?按下 Ctrl+I 并让 Copilot 为您完成。逐步解决问题?使用行内补全通过 Tab-Tab-Tab 走向成功。

将聊天集成到 VS Code 中,由 GitHub Copilot 提供支持,只是旅程中的一步。我们将继续探索其他“内部循环”场景,例如使用自然语言来描述搜索模式或代码生成、自动生成提交消息和拉取请求描述、更智能的代码重命名、重构、转换等等。

请在 GitHubTwitterYouTube 上关注我们。请告诉我们您的想法以及您对 VS Code 中人工智能的想法。

谢谢,

Chris 和 VS Code 团队

祝您智能编码愉快!

© . This site is unofficial and not affiliated with Microsoft.