VSCode 中的 Git Graph扩展使用详解

VSCode 中的 Git Graph 详解

1. 什么是 Git Graph?

Git Graph 是 VSCode 中的一款 Git 可视化扩展,它提供了一种 图形化方式 来查看 Git 提交历史、分支、合并记录等信息,使得 Git 版本管理更加直观和高效。

通过 Git Graph,你可以:

  • 可视化查看 Git 提交历史及分支结构
  • 轻松切换、创建、删除分支
  • 直接提交代码、推送到远程仓库
  • 解决合并冲突
  • 进行 cherry-pickrebase 等高级操作

2. 如何安装 Git Graph?

方法 1:通过 VSCode 扩展市场安装

  1. 打开 VSCode,按下 Ctrl + Shift + X 进入扩展市场。
  2. 在搜索框输入 Git Graph
  3. 选择 Git Graph 扩展(作者:mhutchie)。
  4. 点击 安装(Install)

方法 2:使用 VSCode 命令面板安装

  1. 按下 Ctrl + Shift + P 打开 命令面板
  2. 输入 Extensions: Install Extensions 并选择。
  3. 在搜索框输入 Git Graph 并安装。

3. Git Graph 的基本使用

3.1 打开 Git Graph

打开 Git Graph 方式有多种:

  • 在 VSCode 左侧 Git 图标 处,点击 Git Graph 按钮。
  • 使用命令面板 Ctrl + Shift + P,输入 Git Graph: View Git Graph 并选择。

Git Graph 打开后,会显示如下内容:

  • 分支结构 :直观展示 master/mainfeaturedevelop 等分支。
  • 提交历史:每次提交(commit)都会显示提交信息、提交哈希、作者、时间等。
  • 远程分支状态:标记哪些分支已推送到远程,哪些还未同步。

3.2 Git Graph 界面介绍

Git Graph 的界面包含以下部分:

部分 作用
提交历史 显示提交的时间、作者、commit ID、提交信息
分支结构 展示 Git 分支关系,如 masterfeature-x
提交操作 右键提交可执行 checkoutrevertcherry-pick
远程仓库状态 远程分支会显示 origin/main,本地未推送的提交会有标记

4. Git Graph 的常用操作

4.1 切换分支

  1. 在 Git Graph 界面中,找到你要切换的分支(例如 feature-x)。
  2. 右键点击分支 ,选择 "Checkout Branch"(签出分支)。

4.2 创建新分支

  1. 在 Git Graph 界面中,点击 "New Branch" 按钮。
  2. 输入新分支名称,例如 feature-new

4.3 合并分支

  1. 找到要合并的分支(例如 feature-x)。
  2. 右键该分支,选择 "Merge Into Current Branch"

4.4 解决冲突

如果合并时有冲突,Git Graph 会显示冲突标记:

  1. 打开冲突文件,VSCode 提供多种选项,如 Accept Current ChangeAccept Incoming Change 等。
  2. 解决冲突后提交。

4.5 回滚提交(Revert Commit)

  1. 在 Git Graph 里找到需要回滚的提交。
  2. 右键选择 "Revert Commit"

4.6 拾取提交(Cherry Pick)

  1. 在 Git Graph 里找到 feature-x 分支的提交。
  2. 右键选择 "Cherry Pick Commit"

4.7 推送 & 拉取

  • 推送本地分支到远程 :右键 feature-x,选择 "Push Branch"
  • 拉取远程更新 :右键 main,选择 "Pull"

4.8 删除分支

  • 删除本地分支 :右键 feature-x,选择 "Delete Branch"
  • 删除远程分支 :右键 feature-x,选择 "Delete Remote Branch"

5. Git Graph 进阶功能

5.1 Rebase(变基)

  1. 右键 feature-x,选择 "Rebase Onto..."
  2. 选择 main,然后进行变基。

5.2 查看 Tag(标签)

Git Graph 允许查看标签:

  1. 选择 "Show Tags" ,可以看到 v1.0.0v2.0.0 等标签。
  2. 右键标签可执行 Checkout Tag

6. 总结

Git Graph 功能 操作方式
查看提交历史 打开 Git Graph
切换分支 右键分支 → Checkout
创建分支 New Branch
合并分支 右键分支 → Merge
解决冲突 选 Accept Change
回滚提交 右键提交 → Revert
Cherry Pick 右键提交 → Cherry Pick
变基(Rebase) 右键 → Rebase Onto
推送远程分支 右键 → Push

7. 结语

Git Graph 让 Git 版本控制更加直观,可视化分支、提交历史、合并等操作,使 Git 更易用!🚀

相关推荐
艾莉丝努力练剑7 小时前
GCC编译器深度解剖:从源码到可执行文件的全面探索
c++·ide·经验分享·gcc
熊猫钓鱼>_>7 小时前
在VSCode中更新或安装最新版的npx和uv工具
ide·vscode·uv
ONLYOFFICE8 小时前
【技术教程】如何将文档编辑器集成至基于Java的Web应用程序
java·编辑器·onlyoffice
深耕AI8 小时前
【MFC 小白日记】对话框编辑器里“原型图像”到底要不要勾?3 分钟看懂!
c++·编辑器·mfc
猫头虎9 小时前
IDE mac M芯片安装报错:如何解决“InsCode.app 已损坏”,无法打开
ide·vscode·macos·inscode·编辑器·idea·mac
MicrosoftReactor10 小时前
技术速递|Copilot 的 Next Edit Suggestions(NES)现已在 JetBrains IDE 中开放公测
ide·copilot
n123523518 小时前
AI IDE+AI 辅助编程,真能让程序员 “告别 996” 吗?
ide·人工智能
Doris_LMS19 小时前
Git的强软硬回退(三)
运维·服务器·数据库·git·idea
瓜酷月..19 小时前
GIT(了解)
git
蔗理苦20 小时前
2025-09-04 HTML1——环境配置与简介
css·vscode·html