| title | shortTitle | intro | redirect_from | versions | type | topics | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Using GitHub Codespaces in Visual Studio Code |
Visual Studio Code |
You can develop in your codespace directly in {% data variables.product.prodname_vscode %} by connecting the {% data variables.product.prodname_github_codespaces %} extension with your {% data variables.product.github %} account. |
|
|
how_to |
|
About {% data variables.product.prodname_github_codespaces %} in {% data variables.product.prodname_vscode %}
You can use your local install of {% data variables.product.prodname_vscode %} to create, manage, work in, and delete codespaces. {% data reusables.codespaces.using-codespaces-in-vscode %} For more information on setting up {% data variables.product.prodname_github_codespaces %} in {% data variables.product.prodname_vscode_shortname %}, see Prerequisites.
By default, if you create a new codespace on {% data variables.product.github %}, it will open in the browser. If you would prefer to open any new codespaces in {% data variables.product.prodname_vscode_shortname %} automatically, you can set your default editor to be {% data variables.product.prodname_vscode_shortname %}. For more information, see AUTOTITLE.
If you prefer to work in the browser, but want to continue using your existing {% data variables.product.prodname_vscode_shortname %} extensions, themes, and shortcuts, you can turn on Settings Sync. For more information, see AUTOTITLE.
To develop in a codespace directly in {% data variables.product.prodname_vscode_shortname %}, you must install and sign into the {% data variables.product.prodname_github_codespaces %} extension with your {% data variables.product.github %} credentials. The {% data variables.product.prodname_github_codespaces %} extension requires {% data variables.product.prodname_vscode_shortname %} October 2020 Release 1.51 or later.
Use the {% data variables.product.prodname_vscode_marketplace %} to install the {% data variables.product.prodname_github_codespaces %} extension. For more information, see Extension Marketplace in the {% data variables.product.prodname_vscode_shortname %} documentation.
{% data reusables.codespaces.click-remote-explorer-icon-vscode %}
-
Select "{% data variables.product.prodname_github_codespaces %}" from the dropdown at the top of the "Remote Explorer" side bar, if it is not already selected.
-
Click Sign in to {% data variables.product.prodname_dotcom %}.
-
If you are not currently signed in to {% data variables.product.prodname_dotcom %} you'll be prompted to do so. Go ahead and sign in.
-
When you're prompted to specify what you want to authorize, click the Authorize button for "{% data variables.product.prodname_dotcom %}."
-
If the authorization page is displayed, click Authorize Visual-Studio-Code.
{% data reusables.codespaces.creating-a-codespace-in-vscode %}
{% data reusables.codespaces.click-remote-explorer-icon-vscode %}
-
Under "{% data variables.product.prodname_github_codespaces %}", hover over the codespace you want to develop in.
-
Click the connection icon (a plug symbol).
{% data reusables.codespaces.codespaces-machine-types %} You can change the machine type of your codespace at any time.
Note
{% data reusables.codespaces.codespaces-machine-type-availability %}
{% data reusables.codespaces.changing-machine-type-in-vscode %}
{% data reusables.codespaces.about-changing-storage-size %}
{% data reusables.codespaces.deleting-a-codespace-in-vscode %}
If you are using the {% data variables.product.prodname_vscode_shortname %} web client, you can switch to the Insiders version of the application. For more information about this version of {% data variables.product.prodname_vscode_shortname %}, see Introducing the Insiders Build in the {% data variables.product.prodname_vscode_shortname %} blog.
After you switch versions in a codespace, the web client will continue to use the Insiders version if you stop and restart the codespace. New codespaces that you create and open in the {% data variables.product.prodname_vscode_shortname %} web client will also use the Insiders version.
-
In bottom left of the browser window that's displaying a codespace, click {% octicon "gear" aria-label="Manage" %}.
-
In the menu, select "Switch to Insiders Version."
-
Click Reload.
To switch back to the Stable version of {% data variables.product.prodname_vscode_shortname %}, repeat the process but choose Switch to Stable Version. After you switch back, the codespace will continue to use the Stable version if you stop and restart the codespace. New codespaces that you create and open in the {% data variables.product.prodname_vscode_shortname %} web client will also use the Stable version.
To use {% data variables.product.prodname_github_codespaces %} in the Insiders version of the {% data variables.product.prodname_vscode_shortname %} desktop application, start or create your codespaces from within the {% data variables.product.prodname_vscode_shortname %} Insiders application. For more information see Creating a codespace in {% data variables.product.prodname_vscode_shortname %} and Opening a codespace in {% data variables.product.prodname_vscode_shortname %} earlier in this article.