Skip to main content

Using GitHub Codespaces in Visual Studio Code

You can develop in your codespace directly in Visual Studio Code by connecting the GitHub Codespaces extension with your account on GitHub.

GitHub Codespaces 可用于使用 GitHub Team 或 GitHub Enterprise Cloud 的组织。 更多信息请参阅“GitHub 的产品”。

About GitHub Codespaces in Visual Studio Code

You can use your local install of Visual Studio Code to create, manage, work in, and delete codespaces. To use GitHub Codespaces in VS 代码, you need to install the Codespaces extension. For more information on setting up Codespaces in VS 代码, see "Prerequisites."

By default, if you create a new codespace on GitHub.com, it will open in the browser. If you would prefer to open any new codespaces in VS 代码 automatically, you can set your default editor to be VS 代码. For more information, see "Setting your default editor for GitHub Codespaces."

If you prefer to work in the browser, but want to continue using your existing VS 代码 extensions, themes, and shortcuts, you can turn on Settings Sync. For more information, see "Personalizing GitHub Codespaces for your account."

Prerequisites

To develop in a codespace directly in VS 代码, you must install and sign into the Codespaces extension with your GitHub credentials. The Codespaces extension requires VS 代码 October 2020 Release 1.51 or later.

Use the Visual Studio 代码市场 to install the Codespaces extension. For more information, see Extension Marketplace in the VS 代码 documentation.

  1. 在 VS 代码 中,从左侧边栏单击 Remote Explorer 图标。 Visual Studio Code 中的 Remote Explorer 图标

  2. Click Sign in to view GitHub....

    Signing in to view Codespaces

  3. To authorize VS 代码 to access your account on GitHub, click Allow.

  4. Sign in to GitHub to approve the extension.

  1. 在 VS 代码 中,从左侧边栏单击 Remote Explorer 图标。 Visual Studio Code 中的 Remote Explorer 图标

  2. Use the "REMOTE EXPLORER" drop-down, then click GitHub Codespaces.

    The Codespaces header

  3. Click Sign in to view Codespaces....

    Signing in to view Codespaces

  4. To authorize VS 代码 to access your account on GitHub, click Allow.

  5. Sign in to GitHub to approve the extension.

Creating a codespace in VS 代码

将 GitHub.com 上的帐户连接到 GitHub Codespaces 扩展后,可以创建新的代码空间。 有关 GitHub Codespaces 扩展的详细信息,请参阅 VS 代码市场 Marketplace

注意:目前,VS 代码 不允许在创建代码空间时选择开发容器配置。 如果要选择特定的开发容器配置,请使用 GitHub Web 界面创建代码空间。 有关详细信息,请单击此页顶部的 Web browser(Web 浏览器)选项卡。

  1. 在 VS 代码 中,从左侧边栏单击 Remote Explorer 图标。 Visual Studio Code 中的 Remote Explorer 图标

  2. 单击 Add(添加)图标:

    Codespaces 中的 Create new Codespace(创建新代码空间)选项

  3. 键入要在其中开发的存储库的名称,然后选择它。

    搜索仓库以创建新的 Codespaces

  4. 单击要在其中开发的分支。

    搜索分支以创建新的 Codespaces

  5. If prompted to choose a dev container configuration file, choose a file from the list.

    Choosing a dev container configuration file for Codespaces

  6. 单击您要使用的机器类型。

    新 Codespaces 的实例类型

    :您对可用计算机类型的选择可能受到为组织配置的策略或存储库的最低计算机类型规范的限制。 更多信息请参阅“限制对计算机类型的访问”和“为代码空间计算机设置最小规范”。

Opening a codespace in VS 代码

  1. 在 VS 代码 中,从左侧边栏单击 Remote Explorer 图标。 Visual Studio Code 中的 Remote Explorer 图标

  2. Under "Codespaces", click the codespace you want to develop in.

  3. Click the Connect to Codespace icon.

    The Connect to Codespace icon in VS 代码

Changing the machine type in VS 代码

通常,您可以在选择的远程机器上运行代码空间,从 2 核到 32 核。 每种类型都有不同的资源水平和不同的计费等级。 有关信息请参阅“关于 GitHub Codespaces 的计费”。

默认情况下,在创建代码空间时,将使用具有最低有效资源的计算机类型。 You can change the machine type of your codespace at any time.

  1. In VS 代码, open the Command Palette (shift command P / shift control P).

  2. Search for and select "Codespaces: Change Machine Type."

    Searching for a branch to create a new Codespaces

  3. Click the codespace that you want to change.

    Searching for a branch to create a new Codespaces

  4. Choose the machine type you want to use.

    Note: 您对可用计算机类型的选择可能受到为组织配置的策略或存储库的最低计算机类型规范的限制。 更多信息请参阅“限制对计算机类型的访问”和“为代码空间计算机设置最小规范”。

  5. If the codespace is currently running, a message is displayed asking if you would like to restart and reconnect to your codespace now.

    Click Yes if you want to change the machine type used for this codespace immediately.

    If you click No, or if the codespace is not currently running, the change will take effect the next time the codespace restarts.

Deleting a codespace in VS 代码

当前不在代码空间中工作时,可以从 VS 代码 中删除代码空间。

  1. 在 VS 代码 中,从左侧边栏单击 Remote Explorer 图标。 Visual Studio Code 中的 Remote Explorer 图标

  2. 在“GITHUB CODESPACES”下,右键单击要删除的代码空间。

  3. 单击 Delete Codespace(删除代码空间)

    在 GitHub 中删除代码空间

Switching to the Insiders build of VS 代码

You can use the Insiders Build of VS 代码 within Codespaces.

  1. In bottom left of your Codespaces window, select Settings.

  2. From the list, select "Switch to Insiders Version".

    Clicking on "Insiders Build" in Codespaces

  3. Once selected, Codespaces will continue to open in Insiders Version.