现已推出!阅读 10 月份的新功能和修复。

GitHub Codespaces

GitHub Codespaces 为任何活动提供云驱动的开发环境,无论是长期项目还是短期任务(如审查拉取请求)。您可以从 Visual Studio Code 或基于浏览器的编辑器中使用这些环境。

GitHub Codespaces extension

环境

环境是 GitHub Codespaces 的“后端”部分。这是与软件开发相关的所有计算发生的地方:编译、调试、还原等。当您需要处理新项目、开始新任务或审查 PR 时,您只需启动一个云托管环境,GitHub Codespaces 会负责正确地配置它。它会自动配置您项目所需的一切:源代码、运行时、编译器、调试器、编辑器、自定义点文件配置、相关的编辑器扩展等等。

自定义

GitHub Codespaces 可以在每个项目的基础上完全自定义。这可以通过在项目的存储库中包含一个 devcontainer.json 文件来实现,类似于 VS Code 开发容器 开发。

示例自定义包括

  • 设置要使用的基于 Linux 的操作系统。
  • 自动安装各种工具、运行时和框架。
  • 转发常用端口。
  • 设置环境变量。
  • 配置编辑器设置并安装首选扩展。

有关 codespace 特定的 devcontainer.json 设置,请参阅 配置 Codespaces 文档。

每个用户的点文件配置

点文件是文件名以点 (.) 开头的文件。它们通常包含应用程序的配置信息,可以控制终端、编辑器、源代码管理以及各种其他工具的行为。.bashrc.gitignore.editorconfig 是开发人员常用的点文件示例。

您可以在创建 codespace 时指定包含点文件的 GitHub 存储库、文件的目标位置以及安装命令。

有关如何将点文件配置添加到 codespace 中,请参阅 个性化 Codespaces 文档。

入门

GitHub Codespaces 客户端都有入门主题。这些主题将引导您快速完成登录 GitHub Codespaces、创建第一个 codespace 以及使用首选客户端连接到 codespace 的步骤。

扩展作者

VS Code 扩展 API 隐藏了大多数远程运行的实现细节,因此许多扩展可以在 GitHub Codespaces 环境中正常工作,无需任何修改。但是,我们建议您在 codespace 中测试您的扩展,以确保所有功能都能按预期工作。有关详细信息,请参阅有关 支持远程开发和 GitHub Codespaces 的文章。

基于浏览器的编辑器

您还可以获得完全在浏览器中运行的免费、轻量级 Visual Studio Code 体验。基于 Web 的编辑器可以让您安全、快速地浏览来自 GitHub 的源代码存储库,并进行轻量级的代码更改。您可以在编辑器中打开任何存储库、分支或拉取请求,该编辑器具有 VS Code 的许多功能,包括搜索和语法高亮显示。如果您想运行或调试代码,可以切换到云托管环境或 VS Code 桌面版。

要访问此基于浏览器的编辑器,您可以转到 github.com 上的存储库,然后按 .(句号键)或将存储库的 URL 更改为 github.dev/org/repo,将 github.com 替换为 github.dev

限制:如果您在隐身模式下运行浏览器或启用了广告拦截器,则可能无法使用基于 Web 的编辑器。

注意:此编辑器目前处于技术预览阶段。您今天可以尝试它,并在 https://github.co/browser-editor-feedback 上提供反馈。

已知限制和调整

在使用 Codespaces(特别是 Web 中的 VS Code)时,请记住某些限制。对于这些限制中的某些限制,已经存在解决方法或调整措施来提供一致的开发体验。

对于多个问题(特别是键盘绑定或使用桌面解决方法的问题),您可以将 Codespace 安装并用作 渐进式 Web 应用 (PWA)。

Installing Codespaces as PWA in Microsoft Edge

问题 原因 解决方法
Ctrl+Shift+P 无法在 Firefox 中启动命令面板。 Ctrl+Shift+P 在 Firefox 中是保留键。 使用 F1 启动命令面板。
某些默认键盘绑定(用于调试)在 Web 中有所不同。 由于浏览器可能已经为这些键盘绑定注册了操作,因此我们调整了 Web 中 VS Code 的默认设置。 使用调整后的默认设置。它们会显示在调试操作的工具提示悬停中。
  • 单步跳过在所有浏览器中都是 Alt+F10(而不是 F10)。
  • Web 中的单步跳入在 Windows 浏览器中是 Alt+F11(而不是 F11)。
F11 用于调试,在 macOS 的 Web 或桌面版中均不起作用。 这是一个已知的非浏览器特定限制。有关详细信息,请参阅 问题 #5102 禁用 macOS 中的 F11 以显示桌面。
  • 转到:系统偏好设置 > 键盘 > 快捷键
  • 取消选中 显示桌面 F11 选项
Ctrl+N 用于新建文件,在 Web 中不起作用。 Ctrl+N 将打开一个新窗口。 Ctrl+N 用于创建新文件,在桌面版中有效。
Ctrl+W 用于关闭编辑器,在网页版中无效。 Ctrl+W 在浏览器中关闭当前标签页。 Ctrl+W 在桌面版中有效。
Ctrl+Shift+B 不会在浏览器中切换收藏夹栏。 Codespaces 会覆盖此操作,并重定向到命令面板中的“构建”菜单。 目前没有解决方法。
从 VS Code 拖放文件到 Codespace(反之亦然)不起作用。 您可以在 问题 #115535 中查看更多信息。 您有两个选择
  • 您可以在 Codespace 中右键单击文件将其下载到本地计算机。
  • 您可以从文件资源管理器中将文件拖放到 Codespace 中。
Angular 应用调试在网页版中不受支持。 出于安全原因,在浏览器中运行的代码无法在调试模式下启动另一个浏览器实例。 您有以下几个选项
  • 正常调试 Node.js/服务端 js。
  • 在桌面版中打开 Codespace,在这种情况下,配套工具 将用于启动您的本地 Edge 或 Chrome 安装。
    从浏览器下载没有扩展名的文件会自动添加“.txt”。 这是 Chrome 和 Edge 的行为方式。 有关上下文和未来可能的解决方案,请参阅 问题 #118436
    从远程(包括 Codespaces)下载文件时,可执行位等属性将被删除。 有关上下文和未来可能的解决方案,请参阅 问题 #112099 目前没有解决方法。
    尝试从 Codespace 下载某些文件夹时,您可能会看到提示:“Your_codespace_name 无法打开此文件夹,因为它包含系统文件”。 用户代理可以自由地对敏感目录施加限制级别。有关更多信息,请参阅 此规范Chromium 的黑名单 除了规范和黑名单之外,没有其他解决方法。
    手动访问 https://127.0.0.1:forwarded_port 无法从网页版 Codespace 访问已转发的端口。 这是基于 Codespaces 如何处理端口转发并为网页生成正确 URL 的。 单击来自端口转发通知的链接以打开您的应用程序,或单击 端口视图 中的地球仪图标,这两个操作都将提供正确生成的链接。有关更多信息,请参阅 Codespaces 文档

    某些扩展在网页版中的行为有所不同

    扩展 问题/原因 解决方法
    键盘快捷键与浏览器快捷键冲突的扩展,例如 Git Graph,它使用 Ctrl+R 刷新。 键盘快捷键可能与现有的浏览器快捷键冲突,例如 Ctrl+R 在 Safari 中刷新窗口。 您可以使用基于桌面的 Codespace 而不是基于网页的 Codespace,以充分利用您的键盘快捷键。不同的浏览器可能也有不同的行为(您可以在 Chrome 中刷新 Git Graph)。
    语言包,例如 Visual Studio Code 的日语语言包 语言包扩展目前在基于网页的 Codespaces 中不受支持。 您可以使用基于桌面的 Codespace 来使用语言包并配置显示语言。
    Bracket Pair Colorizer 2 它在浏览器中无法正常工作,因为它引入了难以修复的安装位置依赖关系。 使用 Bracket Pair Colorizer
    浏览器调试器,例如 Firefox 调试器 需要 UI/桌面扩展主机的扩展在浏览器中无法加载。 您可以在本地 VS Code(未连接到 Codespaces)中使用这些扩展。或者,在您的应用程序从 Codespace 运行时,您可以使用其他工具,例如 Chrome DevTools 来检查元素并设置断点。
    用于打开浏览器的扩展,例如 在浏览器中打开 需要 UI/桌面扩展主机的扩展在浏览器中无法加载。 如果可能,请使用替代扩展,例如 Live Server
    项目管理器 项目管理器依赖于同步自定义 projects.json 文件,而 目前不支持 此操作。 您可以使用桌面 Codespaces 或本地 VS Code 中的扩展来保存和管理您的项目,因为这些选项不需要同步自定义文件。
    依赖于 Chrome 的扩展,例如 Protractor 测试运行器浏览器预览 Codespace 中不包含 Chrome。 尝试找到替代体验,或者您可以在本地 VS Code(未连接到 Codespaces)中使用这些扩展。
    Flutter(以及 Flutter 开发总体而言) 由于 Docker 容器和 Codespaces 的性质,Flutter 工作流的几个方面受到限制。
    • Flutter 建议从 snap 安装,但 snap 无法安装在 Codespaces 容器中。
    • Android 模拟器在容器中无法正常工作。
    • Codespaces 无法检测到插入您机器的 USB 设备,这使得在物理设备上进行开发变得不可能。
    • Codespaces 与其他 Linux 环境一样,不支持 iOS 开发。
    您可以使用本地 VS Code 进行 Flutter 开发。
    LaTeX Workshop 该扩展提供三种类型的功能来帮助 LaTeX 作者:1) 一组显示常用命令的视图,2) 一个 PDF 预览器,以及 3) 语言功能,例如代码片段和 IntelliSense。该扩展可以使用相当完整的功能,但有一些网络或安全限制。 以下解决方法解决了视图和预览器功能区域的限制
    • 视图本身可以正常工作,但一些命令尝试启动本机应用程序,例如在操作系统文件资源管理器中显示输出文件夹。这些在网页版中不起作用,因此使用桌面版是一个替代方案。
    • "latex-workshop.view.pdf.viewer" - 此设置提供了一个类似于 Markdown 预览 的 PDF 预览器。您可以在浏览器选项卡、单独的 PDF 阅读器或 VS Code 选项卡中进行预览。
      只有浏览器选项卡在基于网页的 Codespaces 中可用。单独的 PDF 阅读器会静默失败,而 VS Code 选项卡会遇到 内容安全策略 问题。VS Code 选项卡查看器还有其他由于此限制而不可用的功能。
    Git Graph 一些 Git Graph Webview 功能在 Codespaces 中可能受到限制。例如,在提交文件和 Git Graph Webview 之间切换可能会使 Webview 变为空白。 您可以在 VS Code 桌面版中完全使用 Git Graph。
    其他 远程开发扩展(WSL、Dev Containers、Remote - SSH)无法安装在 Codespace 中。 Codespace 本身就是一个远程上下文。 如果您想在另一个远程上下文中运行(例如 WSL 或远程 SSH 计算机),请打开 VS Code 桌面版(未连接到 Codespace),然后启动其他远程扩展之一。如果您想使用 自定义开发容器,您可以在 Codespaces 和 Dev Containers 中使用相同的 .devcontainer
    My_Favorite_Extension 无法正常工作,并且未在上面列出。 还有一些其他问题可能会导致功能在远程上下文中无法按预期工作。 在某些情况下,您可以使用另一个命令来解决问题,但在其他情况下,可能需要修改扩展。查看 远程扩展技巧,了解常见的远程问题以及解决它们的技巧。

    常见问题

    为什么扩展无法在浏览器中安装?

    有一些扩展具有内置的假设或需要在桌面上运行。例如,当扩展访问桌面上的 VS Code 安装中的文件时,或者当扩展依赖于必须在桌面环境中运行的可执行文件时。当您尝试在浏览器中安装此类扩展时,将收到一条信息,表明该扩展不可用。

    注意 此类扩展在从运行在桌面的 VS Code 连接到 Codespace 时仍然可以使用。

    如何允许 VS Code 访问我的剪贴板以进行读取?

    在某些情况下,VS Code 可能会在从剪贴板读取时请求您允许访问剪贴板。您应该能够通过浏览器设置(搜索“网站权限”)或在地址栏右侧查找此选项来授予剪贴板访问权限。

    Allow clipboard access in browser

    授予 VS Code 访问剪贴板的权限后,您可以重试操作。

    如何允许 VS Code 始终打开新标签页和窗口?

    有时,浏览器出于安全预防措施会阻止 VS Code 打开新标签页或窗口。如果发生这种情况,VS Code 将检测到阻止操作并明确提示用户。但是,您可以通过打开浏览器导航栏中的上下文菜单中的网站设置,并允许弹出窗口,来允许 VS Code 始终打开新窗口和标签页。

    Allow pop-up window in browser

    如何在浏览器中允许 VS Code 访问本地文件和文件夹?

    在浏览器中从 VS Code 打开本地文件和文件夹需要浏览器支持 文件系统访问 API。截至目前,Microsoft Edge 和 Google Chrome 都提供了这种支持。如果您想在浏览器中使用 VS Code 时访问本地文件和文件夹,请考虑切换到这两个浏览器之一。

    问题或反馈

    如果您有任何问题,可以查阅 GitHub Codespaces 故障排除指南。如果您想提供反馈,可以在 GitHub Codespaces 讨论 中提交问题。