Skip to main content

在代码空间中开发

可以使用浏览器、Visual Studio Code、JetBrains IDE 或在命令 shell 中在 codespace 中工作。

注意:在 JetBrains IDE 中使用 GitHub Codespaces 目前为公开 beta 版本,可能会随时发生更改。

关于使用 GitHub Codespaces 进行开发

可以使用所选工具在 codespace 中开发代码:

  • 命令 shell,通过使用 GitHub CLI 启动的 SSH 连接。
  • JetBrains IDE 之一,通过 JetBrains 网关。
  • Visual Studio Code 桌面应用程序。
  • Visual Studio Code 的基于浏览器的版本。

使用本文中的选项卡,可以在每种工作方式的信息之间切换。 你当前位于 Visual Studio Code 的 Web 浏览器版本的选项卡上。

在浏览器的 codespace 中工作

在浏览器中使用 Codespaces 可提供功能齐全的开发体验。 可以编辑代码、调试、使用 Git 命令以及运行应用程序。

浏览器中 codespace 的带有批注的屏幕截图

  1. 边栏 - 默认情况下,此区域在资源管理器中显示项目文件。
  2. 活动栏 - 这将显示视图并提供在它们之间切换的方法。 您可以通过拖放来重新排列视图。
  3. 编辑器 - 这是编辑文件的位置。 可以右键单击文件的选项卡以访问选项,例如在资源管理器中查找文件。
  4. 面板 - 这是可以查看输出和调试信息的位置,以及集成终端的默认位置。
  5. 状态栏 - 此区域提供有关 codespace 和项目的有用信息。 例如,分支名称、配置端口等。 为获取 GitHub Codespaces 最佳使用体验,建议使用基于 Chromium 的浏览器,如 Google Chrome 或 Microsoft Edge。 有关详细信息,请参阅“对 GitHub Codespaces 客户端进行故障排除”。

自定义存储库的 codespace

可以通过创建或更新存储库的开发容器配置来自定义为存储库创建的 codespace。 可以从 codespace 中执行此操作。 更改开发容器配置后,可以通过为 codespace 重新生成 Docker 容器来将更改应用于当前 codespace。 有关详细信息,请参阅“开发容器简介”。

个性化代码空间

可以使用 dotfiles 存储库和设置同步为创建的任何 codespace 个性化 codespace 环境的各个方面。 个性化可以包括 shell 首选项和其他工具。 有关详细信息,请参阅“为帐户设置个性化的 Codespaces”。

从代码空间运行应用程序

您可以转发代码空间中的端口以测试和调试应用程序。 还可以管理端口协议,并在组织内或公开共享端口。 有关详细信息,请参阅“转发 codespace 中的端口”。

提交更改

在对代码空间进行更改(无论是添加新代码还是更改配置)之后,您需要提交更改。 将更改提交到仓库可确保从此仓库创建代码空间的其他任何人都具有相同的配置。 这也意味着你所做的任何自定义,例如添加 VS Code 扩展,都会显示给所有用户。

有关详细信息,请参阅“在 codespace 中使用源代码管理”。

使用 Visual Studio Code Command Palette

Visual Studio Code Command Palette 允许你访问和管理 Codespaces 和 Visual Studio Code 的许多功能。 有关详细信息,请参阅“在 Codespaces 中使用 Visual Studio Code Command Palette”。 ## 导航到现有代码空间

  1. 可以在 github.com/codespaces 上查看你创建的每个可用代码空间。

  2. 单击您要在其中开发的代码空间的名称。

    Codespace 的名称

或者,你可以通过导航到该存储库并选择“ 代码”来查看特定存储库的任何 codespace。 下拉菜单将显示存储库中所有处于活动状态的 codespace。

使用本文中的选项卡,可以在每种工作方式的信息之间切换。 你当前位于 Visual Studio Code 的选项卡上。

在 VS Code 的 codespace 中工作

GitHub Codespaces 为你提供完整的 Visual Studio Code 开发体验。 使用 VS Code 在 codespace 中开发时,你可以编辑代码、调试和使用 Git 命令。 有关详细信息,请参阅 VS Code 文档

VS Code 中 codespace 的带批注的屏幕截图

  1. 边栏 - 默认情况下,此区域在资源管理器中显示项目文件。
  2. 活动栏 - 这将显示视图并提供在它们之间切换的方法。 您可以通过拖放来重新排列视图。
  3. 编辑器 - 这是编辑文件的位置。 可以右键单击文件的选项卡以访问选项,例如在资源管理器中查找文件。
  4. 面板 - 这是可以查看输出和调试信息的位置,以及集成终端的默认位置。
  5. 状态栏 - 此区域提供有关 codespace 和项目的有用信息。 例如,分支名称、配置端口等。

有关使用 VS Code 的详细信息,请参阅 VS Code 文档中的用户界面指南

可以直接从 VS Code 连接到你的 codespace。 有关详细信息,请参阅“在 VS Code 中使用 codespace”。

有关故障排除信息,请参阅“对 Codespaces 客户端进行故障排除”。

自定义存储库的 codespace

可以通过创建或更新存储库的开发容器配置来自定义为存储库创建的 codespace。 可以从 codespace 中执行此操作。 更改开发容器配置后,可以通过为 codespace 重新生成 Docker 容器来将更改应用于当前 codespace。 有关详细信息,请参阅“开发容器简介”。

个性化代码空间

可以使用 dotfiles 存储库和设置同步为创建的任何 codespace 个性化 codespace 环境的各个方面。 个性化可以包括 shell 首选项和其他工具。 有关详细信息,请参阅“为帐户设置个性化的 Codespaces”。

从代码空间运行应用程序

您可以转发代码空间中的端口以测试和调试应用程序。 还可以管理端口协议,并在组织内或公开共享端口。 有关详细信息,请参阅“转发 codespace 中的端口”。

提交更改

在对代码空间进行更改(无论是添加新代码还是更改配置)之后,您需要提交更改。 将更改提交到仓库可确保从此仓库创建代码空间的其他任何人都具有相同的配置。 这也意味着你所做的任何自定义,例如添加 VS Code 扩展,都会显示给所有用户。

有关详细信息,请参阅“在 codespace 中使用源代码管理”。

使用 Visual Studio Code Command Palette

Visual Studio Code Command Palette 允许你访问和管理 Codespaces 和 Visual Studio Code 的许多功能。 有关详细信息,请参阅“在 Codespaces 中使用 Visual Studio Code Command Palette”。 ## 导航到现有代码空间

  1. 可以在 github.com/codespaces 上查看你创建的每个可用代码空间。

  2. 单击您要在其中开发的代码空间的名称。

    Codespace 的名称

或者,你可以通过导航到该存储库并选择“ 代码”来查看特定存储库的任何 codespace。 下拉菜单将显示存储库中所有处于活动状态的 codespace。

使用本文中的选项卡,可以在每种工作方式的信息之间切换。 你当前位于 JetBrains IDE 的选项卡上。

在 JetBrains IDE 中的 codespace 中工作

要将 GitHub Codespaces 与 JetBrains IDE 一起使用,必须已安装 JetBrains 网关。 有关安装 JetBrains 网关的信息,请参阅 JetBrains 网站

可以使用所选的 JetBrains IDE 在 codespace 中工作。 创建 codespace 后,可以使用 JetBrains 网关应用程序在首选 IDE 中打开 codespace。

使用 JetBrains IDE 在 codespace 中进行开发时,可以编辑代码、调试和使用 Git 命令。 有关各种 JetBrains IDE 的详细信息,请参阅 JetBrains 文档

IntelliJ IDEA 用户界面

在 GitHub Codespaces 文档中,我们使用 IntelliJ IDEA 作为具有代表性的 JetBrains IDE。 不同的 JetBrains IDE 可能具有不同的布局。

JetBrains IntelliJ IDEA 中 codespace 的带批注的屏幕截图

  1. 导航栏 - 显示当前所选文件或目录的路径。 使用导航栏右侧的按钮执行各种操作,包括生成、运行或调试项目,或者运行 Git 命令以提交和推送更改。
  2. 项目工具窗口 - 显示项目的结构,并允许在编辑器中打开文件。
  3. GitHub Codespaces 工具窗口 - 单击工具窗口左侧栏中的 GitHub Codespaces 插件即可显示。 它显示有关 codespace 的信息,包括其显示名称和计算机类型。 此工具窗口顶部的按钮可用于:
    • 停止 codespace 并断开连接
    • 显示“你的 codespace”网页
    • 查看 codespace 创建日志
    • 重新生成开发容器
  4. 编辑器 - 这是编辑文件的地方。 可以右键单击文件的选项卡以访问选项,例如将选项卡移动到新窗口。
  5. 终端 - 单击主窗口底部的工具窗口栏中的“终端”(状态栏正上方),即可显示。 通过集成终端,无需切换到专用终端应用程序即可执行命令行任务。
  6. 状态栏 - 将鼠标悬停在状态栏左侧的图标上可查看工具列表。 单击图标可隐藏或显示工具窗口栏。 状态栏的右侧显示有关项目的信息,包括当前 Git 分支。

有关 IntelliJ IDEA 用户界面的详细信息,请参阅 IntelliJ IDEA 的 JetBrains 文档

自定义存储库的 codespace

可以通过创建或更新存储库的开发容器配置来自定义为存储库创建的 codespace。 可以从 codespace 中执行此操作。 更改开发容器配置后,可以通过为 codespace 重新生成 Docker 容器来将更改应用于当前 codespace。 有关详细信息,请参阅“开发容器简介”。

个性化代码空间

可以使用 dotfiles 存储库为创建的任何 codespace 个性化 codespace 环境的各个方面。 有关详细信息,请参阅“为帐户设置个性化的 GitHub Codespaces”。

提交更改

在对 codespace 进行更改(无论是添加新代码还是更改配置)之后,需要提交和推送更改。 将更改推送到存储库可确保从此存储库创建 codespace 的其他任何人都具有相同的配置。 这也意味着,为修改为存储库创建的 codespace 的配置所做的任何自定义都将可供使用该存储库的所有人使用。

有关详细信息,请参阅在 codespace 中使用源代码管理

延伸阅读

使用本文中的选项卡,可以在每种工作方式的信息之间切换。 当前位于 GitHub CLI 的选项卡上。

在命令 shell 中的 codespace 中工作

若要详细了解 GitHub CLI,请参阅“关于 GitHub CLI”。

可以使用 GitHub CLI 创建新的 codespace,或启动现有 codespace,然后通过 SSH 连接到它。 连接后,可以使用你喜欢的命令行工具在命令行上工作。

安装 GitHub CLI 并对 GitHub 帐户进行身份验证后,可以使用命令 gh codespace [<SUBCOMMAND>...] --help 浏览帮助信息。 或者,可以通过 https://cli.github.com/manual/gh_codespace 查看相同的参考信息。

有关详细信息,请参阅“将 GitHub Codespaces 与 GitHub CLI 结合使用”。