前言

在我们日常开发工作过程中，可能经常会看到一些离谱的历史代码，或者当项目发生线上事故时，如何快速定位是谁提交的代码导致的？
作为前端开发者，VSCode 是目前最为流行的代码编辑工具，也是日常最常打开的软件。那么如果能够在VSCode里就能直接查看历史提交记录，将是一种很好的体验。VSCode 确实给开发者提供了多种查看Git历史记录的方式，本文将详细介绍各种使用方式。

使用方式

1. 内置 Git 历史记录查看

VSCode 自带了一些基础的 Git 功能，可以帮我们快速查看代码的历史记录。以下是操作步骤：

1. 打开 Git 面板：在 VSCode 的左侧栏中点击 Git 图标，或者通过快捷键 Ctrl + Shift + G（Windows/Linux）或 Cmd + Shift + G（Mac）打开 Git 面板。
   

2. 查看更改记录：在 Git 面板中，会显示当前工作区的所有变更文件。点击任意一个文件，你将看到该文件的更改内容。
   

3. 查看文件历史记录：在编辑器中打开一个文件，右键点击文件内容区域，选择 View File History 即可查看该文件的所有历史提交记录。
   
   

2. GitLens 插件使用

尽管 VSCode 自带了一些 Git 功能，但要更详细地查看历史记录，我们推荐安装一个非常强大的插件——GitLens。

1. 安装 GitLens：点击左侧栏的扩展图标（或者使用快捷键 Ctrl + Shift + X），搜索 GitLens 并安装。
   2. 使用 GitLens 查看历史记录：

• 文件注释：安装完成后，打开一个文件，你会看到每一行代码的旁边都有一行注释，显示最后一次修改这行代码的提交信息。
  

• 查看文件历史：右键点击文件内容区域，选择 GitLens: Show File History。这样你将能看到该文件的详细历史记录，包括每次提交的差异。

• 查看仓库历史：在左侧栏点击 GitLens 图标，选择 Repositories，然后选择你想查看的仓库，你将能看到整个仓库的提交历史。
  

3. Git Blame 功能
   GitLens 插件的一个强大功能是 Git Blame。它可以让你快速查看某行代码是谁在什么时候修改的。这个功能对于代码审查和问题追踪非常有帮助。

• 查看 Blame 注释：打开一个文件后，GitLens 会在每行代码旁边显示 Blame 注释，通过这些注释，你可以看到每行代码的提交信息。
• 详细的 Blame 信息：点击某行代码旁边的 Blame 注释，会弹出一个详细的信息框，包含提交信息、提交者以及提交时间。
  

3. Git Graph 插件

除了 GitLens，还有另一个非常有用的插件是 Git Graph。它可以以图形化的方式展示 Git 提交历史，让你对项目的版本变化有一个直观的了解。

• 安装 Git Graph：与安装 GitLens 类似，点击左侧栏的扩展图标，搜索 Git Graph 并安装。
  

• 使用 Git Graph：安装完成后，按 Ctrl + Shift + P 打开命令面板，输入 Git Graph 并选择 Git Graph: View。你将看到一个图形化的 Git 历史视图，展示了各个分支和提交。
  
  

结语
VSCode 作为一款现代化的代码编辑器，已经为开发者提供了丰富的 Git 支持功能。通过 VSCode 和 GitLens 等插件的结合，我们可以极大地提升代码管理效率，从而专注于代码本身的质量和功能开发。版本控制是现代开发流程中不可或缺的一部分，掌握好 VSCode 中的 Git 功能，将助你在开发工作中游刃有余。