在本文中，我们将介绍如何结合开发者可用的一些最强大的工具——VS Code 和 Git——开始为开源和私人项目做出有意义的贡献。在介绍如何使用 VS Code 驱动 Git 之前，我们先来了解一些背景信息。
什么是 VS Code？
Visual Studio Code，简称 VS Code，是一款可在 Mac、Windows 和 Linux 上运行的简洁代码编辑器，具有交互式调试器、丰富的开发者工具集成以及众多扩展，可以更轻松地编写代码。
根据 StackOverflow 2021 年的开发者调查，VS Code 是最受欢迎的集成开发环境（IDE），在 80,000 多名受访者中，有 71% 表示 VS Code 是他们的首选 IDE。有关 VS Code 功能和历史的更多信息，请访问 VS Code 的官方 "Why VS Code" 页面。
什么是 Git？
Git 是一种分布式版本控制工具，由 Linus Torvalds 于 2005 年创建，用于管理 Linux 内核的开发。简而言之，Git 跟踪对文件的更改，使您能够在需要时恢复到先前的文件版本。
GitLens —— 让 VS Code Git 功能更强大的免费扩展
GitLens 是 VS Code 中最受欢迎的 Git 扩展，安装量已超过 2000 万。它提供了代码作者信息，并释放了 VS Code 中 Git 的全部潜力。
2022 年，我们增加了一组全新的功能，即 GitLens+ 功能。其中首次推出的 GitLens+ 功能包括 Visual File History 视图和 Worktrees。最初，这些功能要求在本地和公开托管的仓库上使用时需要免费账户，而在私有仓库上使用时则需要付费账户。
然而，随着 2022 年 10 月 GitLens 13 的发布，我们引入了美观的新 Commit Graph，期望每个人都能无障碍地在本地和公开仓库上使用 GitLens+ 功能。因此，我们取消了免费账户的限制，现在仅在私有仓库上使用时需要专业账户。
GitLens+ 的目标是创建一个可持续的模型，使我们能够继续大量投资于 GitLens 的免费开源核心功能，这些功能旨在提升生产力、安全性、易用性等，同时增加一组专门为专业开发者和团队设计的可选功能。GitLens+ 功能标有 ✨符号以便识别。
想要更好地使用 Git 和 VS Code？下载 GitLens 扩展，访问宝贵的文件历史和代码作者信息，帮助您更自信地编码。
GitLens 提升了 VS Code 内置的 Git 功能。无论您是经验丰富的 Git 开发人员还是刚开始使用 Git，GitLens 都可以更轻松、安全和快速地发挥 Git 的全部功能。本教程将向您展示如何在 VS Code 中使用 GitLens，并充分利用该工具。注册 GitLens+ 以获得更好的体验——它是免费的！
使用 VS Code 进行 Git 工作流
接下来，我们将开始介绍如何在 VS Code 中使用 Git 工作流。您将学习如何创建 Git 仓库、提交更改、连接远程仓库、推送更改，并在整个过程中利用 GitLens 扩展使 Git 在 VS Code 中的使用更加强大。
在 VS Code 中使用 Git 的先决条件
在使用 VS Code 的 Git 集成之前，首先需要确保已下载并配置 Git。要检查是否已安装 Git，可以通过使用快捷键 CTRL + 打开 VS Code 中的集成终端，然后输入 git --version。如果终端返回类似 git version 后跟任意版本号的内容，则表示已安装 Git。如果没有返回任何内容，则需要前往 Git 官方下载页面 下载适合您操作系统的版本。
接下来，您应验证 Git 是否已正确配置，方法是设置您的姓名和邮箱。要检查是否已配置 Git，请在终端中运行以下命令：
git config --global --list
如果 Git 已配置，终端会返回您设置的用户名和邮箱。如果没有配置，则需要通过以下步骤配置 Git：
设置姓名：
git config --global user.name <您的姓名>
设置邮箱：
git config --global user.email <您的邮箱>
这些信息是使用 Git 所必需的，在提交任何更改之前必须输入。有关 Git 设置和初始要求的更多信息，请查看 Git 官方文档。
在 VS Code 中打开 Git 仓库
确认 Git 已在您的机器上正确安装和配置后，您需要初始化本地仓库或克隆并打开现有项目。
初始化仓库有多种方式，您可以根据工作流和当前情况选择适合的方法。一般来说，当开发者希望为现有项目做贡献时会克隆远程仓库；当开始一个全新项目时会创建一个新仓库。
使用 URL 在 VS Code 中克隆 Git 仓库
要使用 URL 将现有仓库克隆到本地机器，请按照以下步骤操作：
-
选择活动栏上的源代码控制图标。
在仓库操作选项中选择“Clone Repository”（克隆仓库）。
前往您偏好的仓库托管服务（如 GitHub）。
-
在左上角的搜索栏中搜索您希望克隆的远程仓库，并选择该仓库。
点击绿色的 “Code” 按钮。
-
复制远程仓库的 URL。
将 URL 粘贴到 VS Code 的命令面板中。
接下来，您将被提示选择在本地机器上的保存位置。完成后，您就可以开始对该仓库进行操作。
使用 VS Code 命令面板克隆现有的 Git 仓库
您也可以通过命令面板克隆现有仓库并在本地环境中开始工作。克隆现有 Git 仓库的步骤如下：
-
选择活动栏上的源代码控制图标。
在仓库操作选项中选择“Clone Repository”。
在命令面板的下拉列表中选择您要克隆的托管服务（如 GitHub）。
选择您要克隆的远程仓库。
项目将被复制到您的本地机器，您可以开始对其进行工作。
使用 VS Code 终端初始化新的 Git 仓库
要使用 VS Code 终端初始化新的 Git 仓库，请首先在本地机器上创建并命名一个新文件夹。
然后，进入 VS Code 终端并运行 git init <文件夹名称>。这样会在 VS Code 中打开文件夹，并在项目内自动创建 .git 文件夹以存储 Git 元数据。
使用 VS Code 侧边栏按钮初始化新的 Git 仓库
您还可以选择使用 VS Code 的侧边栏按钮初始化仓库。操作步骤如下：
在您的机器上创建并命名一个新文件夹。
-
打开 VS Code，在主屏幕的开始菜单下选择“Open”来打开文件夹。
选择活动栏中的源代码控制图标。
-
点击“Initialize Repository”来初始化仓库。
VS Code 中的 Git 工作流
一旦对项目进行了更改并希望保存，最好提交这些更改。可以将提交视为工作中的“存档点”。
随着项目的增长，您可以查看、修改并在旧提交的基础上构建新的更改。提交更改的 Git 工作流程如下：
- 编辑项目
- 暂存更改
- 编写提交信息
- 提交更改
使用 GitLens 在 VS Code 中跟踪更改
✨ 提交图表（Commit Graph）
GitLens 提交图表让您轻松可视化并监控所有正在进行的工作，每个提交节点中包含了丰富的信息。您可以看到每个提交的作者、日期和提交信息，还可以查看每个提交中更改的文件。这有助于理解代码库的演变过程并识别需要关注的部分。
提交图表是交互式的，包含全面的上下文菜单，您可以直接在图表上执行 Git 操作，例如合并、挑选和还原更改，或使用丰富的提交图表搜索功能。
GitLens 的提交图表使得跟踪和管理工作进度变得更加简单高效。
- 通过右键菜单与分支、提交、标签等交互
- 双击分支以签出分支
- 丰富的提交搜索和筛选功能
- 查看 Pull Requests 的信息
- 活动迷你地图可快速查看仓库活动
- 更改列可视化每个提交中对文件的更改
- 滚动标记器可快速找到并跳转到关注点
提交图表对所有公共仓库的用户免费开放，且无需账号。对于拥有 GitLens+ 订阅的用户，还可以在私有仓库中使用提交图表。
内联 Blame 注释和 CodeLens
GitLens 内联 Blame 注释在文件中的每行代码旁显示作者和提交信息。将鼠标悬停在代码行上时会显示一个工具提示，其中包含作者姓名、用户名及提交时的提交信息。
此功能帮助您追踪代码更改和理解每行代码的历史，还可以追溯特定行的更改并了解是谁进行了更改。Blame 注释可用于识别团队成员的代码贡献，有助于分配代码的责任和贡献。此功能也可以帮助识别和跟踪代码中的错误，从而更轻松地排除问题。
CodeLens 是 VS Code 中的强大工具之一，提供了可点击的链接，显示提交详情，并允许您从快速选择菜单中进行比较、导航和深入探索每个提交。
文件注解
借助文件注解功能，您可以在一个便捷的视图中查看 Git 仓库和文件的详细信息。启用文件注解时，GitLens 会提供一个侧边栏，显示当前打开文件的相关信息。您可以查看文件的提交历史，包括每个提交的作者和日期；将鼠标悬停在某个提交上时，还可以看到完整的提交信息。
GitLens 文件注解还展示了文件在每次提交中的更改，您可以看到哪些行被添加、修改或删除，使得追踪更改和理解文件随时间的演变更加简单。文件注解包含一个交互式代码热力图，直观地显示代码更改最多的行，便于发现可能需要关注或优化的代码区域。
如果您在团队环境中工作，文件注解还可以帮助您识别是谁在何时对文件做了修改。您可以查看每位团队成员的贡献，并快速导航到每次更改的提交历史。
状态栏 Blame
使用状态栏 Blame 功能，您可以快速查看当前选中代码行的作者和提交信息。此信息会显示在 Visual Studio Code 编辑器窗口底部的状态栏中。状态栏 Blame 还会显示代码的最后修改时间，帮助您识别陈旧或过时的代码，或了解特定代码更改的背景。
只需点击任意一行代码，GitLens 就会在状态栏中显示该行的作者、提交信息和最后修改时间。
提交详情
提交详情视图提供了关于提交和暂存（stash）的丰富信息。您可以快速查看提交的作者、提交 ID、相关的任务和拉取请求链接、变更的文件等信息。
当提交详情视图未固定时，它会根据您在编辑器中浏览文件、选择提交和暂存内容的操作进行上下文跟随。您还可以在提交图表、提交视图、暂存视图、交互式变基编辑器以及视觉文件历史中查看提交详情。您还可以从悬停提示、上下文菜单和快捷选择菜单中打开提交或暂存的详细信息视图。
在 VS Code 中暂存更改
GitLens - 提交图表上的工作进度 (WIP)
在 GitLens 中，当您对文件进行了更改并保存后，工作进度 (WIP) 会在 GitLens 提交图表上以“工作进度”行的形式显示。只需右键点击，即可访问 WIP 上下文菜单，从中可以使用诸如“暂存所有更改”、“打开详情”和“打开源代码控制”等实用选项。这些功能让您更有效地管理工作进度。
VS Code 界面
VS Code 会在活动栏上的源代码控制图标旁显示一个蓝色圆圈，指示项目中未暂存的更改数量，方便您随时查看。
当您准备好暂存更改时，可以将鼠标悬停在文件上，然后点击 + 图标来暂存单个文件。
图标用于暂存单个文件 要在终端中暂存单个文件，只需运行 git add <文件名>。
如果您有多个文件要暂存，并希望一次性暂存它们，可以导航到“更改”部分并选择 + 图标。
图标用于一次性暂存所有更改的文件
在终端中要一次性暂存所有更改，只需运行 git add --all。
*注意：将所有更改一起暂存并提交是一个不良习惯。一起暂存并提交的文件会共享相同的提交信息，这可能会使 Git 日志变得难以理解。频繁提交更改可以减少将不相关的更改放在同一提交中的需要，从长远来看也会为您节省时间。
在 VS Code 中提交更改
当您所需的文件已暂存完毕后，就可以提交更改了。在“Message”字段中撰写清晰的提交信息，以说明您更改的目的，字段位于您暂存文件的上方。然后，选择 ✓ 图标以完成提交。
如果您喜欢使用 VS Code 集成终端，可以运行 git commit -m "<提交信息>" 进行提交。-m 标志用于添加提交信息，说明更改对项目的影响。包含提交信息是一个良好的实践，这有助于您和其他项目贡献者更轻松地跟踪项目的更改。
要在终端中验证提交是否成功，可以运行 git log，终端会返回最新的提交及其相关信息。
如果您更喜欢可视化的方法，可以通过 VS Code 的时间轴视图确认提交是否成功。要访问该视图，选择活动面板中的“文件资源管理器”图标，然后选择“Timeline”。
使用 GitLens 获取宝贵的提交历史信息
一旦您的更改已提交，GitLens 的 Blame 注释变得更加有用。
使用 GitLens 的 Blame 注释，您可以识别特定更改的提交人、修改时间、提交 SHA 等信息。要在 GitLens 中访问注释，只需选择并悬停在已提交的更改上，信息会显示在代码行下方。
您还可以使用 GitLens 浏览项目的修订历史记录。如果您想查看文件随着时间的变化或将当前项目状态与一周前的状态进行比较，GitLens 可以实现这些操作。
要在 GitLens 中访问所需文件的修订历史，请执行以下操作：
- 选择您所需的文件。
- 点击屏幕右上角的图标（一个带向左箭头的圆圈），即可返回项目的先前版本。
在 VS Code 中连接 Git 远程仓库
在 Git 中托管项目的远程仓库是大多数开发者与其他贡献者分享工作的方式。无论是作为企业团队的一部分还是开源贡献者，远程仓库通常是项目的最新版本，也是唯一的可信来源。如果您希望他人能够查看您的代码并为项目做出贡献，您需要设置远程仓库以供他人访问项目代码库。
要创建远程仓库，请前往 GitHub 并选择“New”。
完成选择后，您会看到如下界面。
在 GitHub 中创建新的远程仓库
输入远程仓库名称并选择“Create repository”。仓库创建完成后，您可以选择通过 HTTPS 或 SSH 密钥复制远程仓库的 URL。复制 URL 后，可以通过 VS Code 的终端或命令面板将本地项目连接到远程仓库。
使用 VS Code 集成终端连接远程仓库
如果您更偏好键盘操作，可以在终端中将本地仓库连接到远程仓库。在 VS Code 中执行以下步骤：
- 复制远程仓库的 URL。
- 打开 VS Code 终端。
- 运行命令
git remote add origin <粘贴 URL>并按下 Enter 键。
使用 VS Code 状态栏连接远程仓库
如果您的 GitHub 帐号已连接到 VS Code，您可以直接在 VS Code 中快速创建远程仓库。操作步骤如下：
- 导航到窗口底部的状态栏。
- 选择一个看起来像云且带有向上箭头的图标。
- 在命令面板中选择发布到公共或私有仓库。
无论使用何种方式连接远程仓库，都可以通过查看窗口底部状态栏中的图标确认项目是否已连接。如果本地项目未连接到远程仓库，状态栏会显示一个带向上箭头的云图标；如果已连接，则显示一个类似刷新图标的圆圈。
另外，您可以导航到活动栏中的源代码管理图标，然后选择“Remotes”来验证仓库连接状态。如果已连接远程仓库，“Remotes”栏会显示类似“REMOTES (1)”的提示，括号中的数字表示连接的远程仓库数量。
在 Git 中将更改推送到远程仓库
一旦远程仓库连接完毕，您可以通过推送操作将本地项目中的更改发送到远程仓库。推送可以帮助保持远程仓库与本地项目的最新同步，使其他项目贡献者能够处理这些更改。
要从侧边栏推送暂存的更改，只需选择源代码管理图标，然后选择“Sync Changes”（同步更改）按钮。
在侧边栏中使用“Sync Changes”按钮将更改推送到远程仓库
如果您使用集成终端推送提交的更改，运行 git push origin main 即可。
利用 GitLens 查看项目贡献者及其代码
GitLens 提供了一个“贡献者视图”选项，帮助您查看项目的所有贡献者及其贡献内容。对于大型项目，这个功能尤为有用，可以方便地查看所有协作者及其代码贡献，只需点击他们的个人资料即可。
要添加此视图，打开 VS Code 命令面板，搜索
GitLens: Show Contributors View，然后从下拉菜单中选择它。源代码管理图标下会出现一个新选项：GitLens 贡献者选项
点击下拉箭头可查看所有项目贡献者。
在 Git 中从远程仓库拉取更改
拉取更改是开发者用于将本地项目与远程更新同步的过程。如果您正在与多位贡献者合作，建议定期拉取更改，以便了解其他人的工作内容，并保持项目的最新进展。
您可以通过 VS Code 侧边栏中的三点省略号轻松拉取更改。首先，点击源代码管理视图中的省略号，然后从下拉菜单中选择“Pull”（拉取）。
若使用集成终端拉取更改，只需运行 git pull。
准备好开始在 Git 和 VS Code 中贡献代码！
现在，您已经掌握了在 VS Code 中遵循基本 Git 工作流程的工具！了解如何在 VS Code 中使用 Git 可以帮助您更有效地与团队成员协作，同时也让您轻松地开始为开源项目做出有意义的贡献。Git 可能看起来复杂，但 VS Code 尤其在结合 GitLens 使用时，能够为您提供必要的工具、强大的功能和直观的用户体验，助您走向成功。
