Skip to main content

Using 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 Enterprise Cloud.

Codespaces is available for organizations using GitHub Team or GitHub Enterprise Cloud. 詳しい情報については「GitHubの製品」を参照してください。

About 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 Codespaces in VS Code, you need to install the GitHub Codespaces extension. For more information on setting up Codespaces in VS Code, 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 Code automatically, you can set your default editor to be VS Code. For more information, see "Setting your default editor for Codespaces."

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

Prerequisites

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

Use the Visual Studio Code Marketplace to install the GitHub Codespaces extension. For more information, see Extension Marketplace in the VS Code documentation.

  1. VS Codeの左サイドバーで、 Remote Explorerのアイコンをクリックしてください。 Visual Studio CodeのRemote Explorerアイコン

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

    Signing in to view Codespaces

  3. To authorize VS Code to access your account on GitHub Enterprise Cloud, click Allow.

  4. Sign in to GitHub Enterprise Cloud to approve the extension.

  1. VS Codeの左サイドバーで、 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 Code to access your account on GitHub Enterprise Cloud, click Allow.

  5. Sign in to GitHub Enterprise Cloud to approve the extension.

Creating a codespace in VS Code

After you connect your account on GitHub.com to the GitHub Codespaces extension, you can create a new codespace. For more information about the GitHub Codespaces extension, see the VS Code Marketplace marketplace.

Note: Currently, VS Code doesn't allow you to choose a dev container configuration when you create a codespace. If you want to choose a specific dev container configuration, use the GitHub web interface to create your codespace. For more information, click the Web browser tab at the top of this page.

  1. VS Codeの左サイドバーで、 Remote Explorerのアイコンをクリックしてください。 Visual Studio CodeのRemote Explorerアイコン

  2. Click the Add icon: .

    Codespaces の [Create New Codespace] オプション

  3. Type the name of the repository you want to develop in, then select it.

    新しい Codespaces を作成するためのリポジトリを検索する

  4. 開発するブランチをクリックします。

    新しい Codespaces を作成するためのブランチを検索する

  5. Click the machine type you want to use.

    新しい Codespaces のインスタンスタイプ

    注釈: Your choice of available machine types may be limited by a policy configured for your organization, or by a minimum machine type specification for your repository. For more information, see "Restricting access to machine types" and "Setting a minimum specification for codespace machines."

Opening a codespace in VS Code

  1. VS Codeの左サイドバーで、 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 Code

Changing the machine type in VS Code

Typically, you can run your codespace on a choice of remote machine, from 2 cores to 32 cores. これらはそれぞれ、異なるレベルのリソースと支払い層を持っています。 For information, see "About billing for Codespaces."

By default the machine type with the lowest valid resources is used when you create a codespace. You can change the machine type of your codespace at any time.

  1. In VS Code, 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: Your choice of available machine types may be limited by a policy configured for your organization, or by a minimum machine type specification for your repository. For more information, see "Restricting access to machine types" and "Setting a minimum specification for codespace machines."

  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 Code

You can delete codespaces from within VS Code when you are not currently working in a codespace.

  1. VS Codeの左サイドバーで、 Remote Explorerのアイコンをクリックしてください。 Visual Studio CodeのRemote Explorerアイコン

  2. Under "GITHUB CODESPACES", right-click the codespace you want to delete.

  3. Click Delete Codespace.

    GitHub で Codespaces を削除する

Switching to the Insiders build of VS Code

You can use the Insiders Build of VS Code 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.