练习 - 在 Visual Studio Code 网页版中使用现有存储库

  • 2 分钟

你想要在基于浏览器的编辑器中浏览和编辑启动代码。 你需要在 VS Code 网页版中使用远程存储库。

在本练习中，我们将打开 Microsoft VS Code 存储库 ，以便你可以练习打开远程存储库，进行轻量级的更改，以及查看集成的源代码管理体验。

打开存储库

首先，打开远程存储库以浏览文件。

  1. 在 https://vscode.dev 的资源管理器视图中，单击“打开远程存储库”按钮。

    突出显示 VS Code 网页版资源管理器视图中的“打开远程存储库”功能的屏幕截图。

  2. 从 GitHub 中选择“打开存储库”选项。 如果出现提示，登录到你的 GitHub 帐户。

    显示命令面板中“从 GitHub 打开存储库”提示符的屏幕截图。

  3. 在对话框中键入 microsoft/vscode，然后选择第一个选项。

    在搜索 microsoft/vscode 后，突出显示“打开远程存储库”提示符中列出的 microsoft/vscode 存储库的屏幕截图。

  4. 存储库将在几分钟内加载，无需在本地克隆任何代码。 你现在可以像平常一样浏览和编辑代码！

或者，还可以通过在存储库 URL 前面加上 https://vscode.dev/github/ 来快速打开远程存储库。 例如，可以在浏览器中键入 https://vscode.dev/github/microsoft/vscode 以打开此存储库！

编辑代码

现在存储库已打开，你可以对代码进行任何编辑，并查看反映在源代码管理中的编辑。

  1. 在任何文件中，进行细微的更改。 请注意，更改会自动保存，这是 VS Code 网页版的默认体验。

  2. 导航到边栏中的源代码管理器。 请注意，在上一步中所做的更改显示为挂起的更改。

    显示 VS Code 中 Web 的源代码管理资源管理器视图的屏幕截图。

  3. 浏览器中的源代码管理器体验与桌面应用程序类似。 例如，你可以提交和推送更改、切换分支和创建拉取请求。

  4. 由于正在浏览 GitHub 存储库，因此还可以查看 GitHub 拉取请求。 导航到边栏上的 GitHub 视图，其中会显示可供查看的拉取请求列表。

    显示 GitHub 视图中存储库的活动拉取请求列表的屏幕截图。

    此功能由 GitHub 拉取请求和问题扩展提供支持，该扩展也适用于 VS Code Desktop！ 在 VS Code 网页版中登录到 GitHub 帐户后，此扩展默认处于启用状态。

你已成功打开远程存储库、进行编辑，并熟悉了集成的源代码管理！ 使用 VS Code 网页版的主要优势之一是它在基于浏览器的轻型编辑器中即时提供的功能集。

在下一部分中，你将了解如何使用一个基本命令从 VS Code 网页版的轻型功能转到 VS Code 桌面版的完整功能集。