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 更易用!🚀

相关推荐
@BreCaspian4 分钟前
Git 推送失败解决教程——error: failed to push some refs to
大数据·git·elasticsearch
Java斌1 小时前
70年使用权的IntelliJ IDEA Ultimate安装教程
java·ide·intellij-idea
weixin_466485112 小时前
PyCharm中运行.py脚本程序
ide·python·pycharm
程序猿小D2 小时前
第14节 Node.js 全局对象
linux·前端·npm·node.js·编辑器·vim
aningxiaoxixi2 小时前
Android Studio 之基础代码解析
android·ide·android studio
waterHBO3 小时前
一个小小的 flask app, 几个小工具,拼凑一下
javascript·vscode·python·flask·web app·agent mode·vibe coding
界面开发小八哥3 小时前
「Java EE开发指南」如何使用MyEclipse在Web项目中用Web Fragments?
java·前端·ide·java-ee·eclipse·myeclipse
该换个名儿了4 小时前
git多个commit合并成一个
前端·git
不爱学英文的码字机器4 小时前
[Git] 分布式版本控制 & 远程仓库协作
分布式·git
Stack_guigui5 小时前
git连接本地仓库以及gitee
git·gitee