了解如何在 Visual Studio Code 中使用 GitHub 集成,包括身份验证、发布存储库和查看存储库时间线。
简介
Visual Studio Code 是世界各地许多软件开发人员使用的一款轻量、免费的代码编辑器。 GitHub 是用于托管开发项目的版本控制平台。 Visual Studio Code 可提供集成的 GitHub 体验,使你可以更轻松地从代码编辑器内管理项目。
假设你想开始参与托管在 GitHub 上的项目。 首先,你必须在本地获取存储库的副本。 然后,你需要花时间浏览 GitHub 上的代码文件和历史记录,以获得有关代码更改的原因、更改者以及代码存在时间的上下文。 为此,你可能需要在编辑器和 GitHub 之间频繁切换。
相反,你可以直接通过 Visual Studio Code 获得集中化体验。 在本模块中,你将使用 Visual Studio Code 中的 GitHub 集成来启动 GitHub 上的一个新存储库、克隆现有存储库,并获得每个文件的历史记录的上下文 – 以上所有操作都无需离开编辑器。
先决条件:Git 概念的基本知识
登陆到GitHub
使用 GitHub 执行任何操作之前,必须确保可以进行身份验证。 这通常是一个冗长的多步骤过程,涉及生成和使用 SSH 密钥。 通过 Visual Studio Code 使用 GitHub 的一个好处是,它可以为你处理所有身份验证设置。
通过Visual Studio Code对GitHub进行身份验证
从Visual Studio Code访问GitHub帐户
Visual Studio Code中的GitHub功能
请确保安装了 Visual Studio Code 的最新版本。 选择活动栏中的配置文件/帐户图标,选择“检查更新”,然后安装最新版本(如有必要)。
选择活动栏中的扩展图标。 搜索“GitHub 拉取请求和问题”扩展并进行安装。
安装该扩展后,可以选择活动栏底部的“帐户”图标,然后选择“登录以使用 GitHub 拉取请求和问题”。
此时将打开一个浏览器,系统会提示你授予 Visual Studio Code 访问 GitHub 的权限。
选择“继续”。
Visual Studio Code 窗口将重新打开,并且你已登录。 再次选择帐户图标并查看 GitHub 用户名即可再次检查。
发布存储库
作为已对 GitHub 进行身份验证的 Visual Studio Code 用户,你将获得对 GitHub 工作流的一些改进。 其中一项改进是能够将项目从计算机直接“发布”到 GitHub。
什么是发布?
如果从一个尚未推送到 GitHub 的新项目开始,在 GitHub 上创建该项目需要执行多个步骤:
- 在 Github.com 上创建 GitHub 存储库。
- 复制远程终结点。
-
在本地运行
git init
。 - 添加远程终结点。
- 使用 .gitignore 文件指定要推送到 GitHub 的项。
- 暂存文件。
- 添加提交消息。
- 推送到存储库。
很多步骤意味着很多工作。
Visual Studio Code 有一个内置的发布功能,它可以完全自动化此过程,并允许你直接从 Visual Studio Code 界面中执行此操作。
通过Visual Studio Code发布到GitHub
通过 Visual Studio Code 将项目发布到 GitHub 有两种方法:通过源代码控制管理 (SCM) 视图和通过命令面板。
使用 Visual Studio Code 中的内置终端中的 Git (Ctrl+`)。
通过SCM视图发布
如果尚未启动项目的存储库,则可以直接通过 SCM 视图发布项目。
可以通过选择活动栏上的 SCM 图标在 Visual Studio Code 中切换 SCM 视图。 你将看到一个显示“发布到 GitHub”的按钮。
选择此按钮将启动发布过程:
- 指定要在 GitHub 上创建的存储库的名称。
- 指定应推送到 GitHub 的文件。 任何未选择的文件将自动添加到 .gitignore 文件中,该文件是在发布过程中创建的。
- 你的代码将暂存并提交,并显示消息“首次提交”。
- 你的代码将推送到新创建的 GitHub 存储库中。
通过命令面板发布
如果已针对 GitHub 在本地启动了项目,则不会在 SCM 视图中看到“发布”按钮。 可以使用命令面板中的“发布到 GitHub”选项将项目发布到 GitHub。
此操作将启动与 SCM 视图中的“发布”按钮相同的工作流,并且具有完全相同的步骤。 如果项目已包含 .gitignore 文件,则不会提示你选择要推送的项。
创建存储库并进行发布
通常,必须先在 GitHub 上创建一个存储库,然后才能发布代码。 Visual Studio Code 允许你在编辑器中直接执行此操作。 以下步骤将帮助你创建一个新项目,然后通过 Visual Studio Code 将该项目发布到 GitHub。
步骤1:创建新项目
-
在计算机上创建一个名为“mslearn-demo”的文件夹。
-
在 Visual Studio Code 中,选择“文件”菜单,然后选择“打开文件夹”。
-
选择在步骤 1 中创建的“mslearn-demo”文件夹。
创建README.md
README 文件是用户访问 Github.com 上的存储库时看到的文件。
-
在“文件”菜单上,选择“新建文件”。
-
将以下文本添加到文件中。
# My GitHub Project This is my GitHub project. I published it directly from Visual Studio Code.
-
在“文件”菜单中,选择“保存”。
-
将文件另存为“README.md”。
创建.env.development
许多程序使用 .env 文件类型来定义机密的程序信息。 不应将机密信息(例如数据库连接字符串)推送到 GitHub。
-
在“文件”菜单上,选择“新建文件”。
-
将以下文本添加到文件中。
CONNECTION_STRING=secret-that-should-not-be-pushed-to-github
-
在“文件”菜单中,选择“保存”。
-
将文件另存为“.env.development”。
步骤2:发布到GitHub
-
选择活动栏上的 SCM 图标,打开源代码控制管理 (SCM) 视图。
-
选择“发布到 GitHub”。
-
出现提示时,选择“发布到 GitHub 公共存储库”。
-
清除 .env.development 文件选择,因为我们不需要将它发布到 GitHub。
-
选择“确定”。
现在项目将发布到 GitHub。
步骤3:在GitHub上查看项目
-
从 Visual Studio Code 的通知中选择“在 GitHub 中打开”。
-
在 Github.com 上查看存储库。
-
请注意,提交消息设置为“首次提交”。
-
请注意,项目中有一个名为 .gitignore 的新文件。 Visual Studio Code 在发布过程中添加了此文件。
步骤4:在Visual Studio Code中检查 .gitignore
-
在 Visual Studio Code 中,选择“视图”菜单。
-
从下拉菜单中选择“资源管理器”。
-
选择“.gitignore”文件。
-
请注意,“.env.development”文件已添加到“.gitignore”。 此处添加的任何文件或目录将不会推送到 GitHub。
刚才执行的操作
回顾一下你在本部分执行的操作:
- 创建了一个新项目和一个 README 文件
- 通过 Visual Studio Code 将该项目发布到了 GitHub
- 看到在 Github.com 上创建了存储库
- 检查了 .gitignore 文件,该文件是在你选择不包括 .env.development 文件时自动创建的
Visual Studio Code 处理了需要在后台进行的所有繁琐工作,实现了发布工作流的无缝化。
但很多时候,你将从 GitHub 启动项目,而不是从本地计算机启动。
克隆现有存储库
克隆存储库并获取上下文