VSCode + Git 全流程可视化操作指南(超详细保姆级)

VSCode + Git 全流程可视化操作指南(超详细保姆级)

目录

一、前言

二、Git 安装与环境检测

1)下载地址Git 官方下载页https://git-scm.com/downloads

2)安装步骤

3)检查是否安装成功

三、VSCode Git 插件配置

四、git 本地代码版本控制

4.1 设置全局 git 用户名和邮箱

4.2 初始化仓库

4.3 暂存与提交

4.4 VScode左侧文件栏右侧字母含义:

4.5 文件修改与版本历史

1)修改文件时,VSCode 左侧会显示:

2)版本记录

4.7 版本对比与回退

4.8 分支管理

4.9 标签创建与推送

五、远程仓库管理

5.1 创建远程仓库

5.2 创建 SSH 密钥

5.3 推送与拉取

5.4 克隆远程仓库

六、冲突解决与代码 Review

七、多账户管理(多 SSH 配置)

八、Git 高级技巧

8.1 忽略文件 .gitignore

8.2 Git LFS 上传大文件

8.3 网络与权限问题

九、常用 Git 命令汇总


该博客的目的是让小白从零开始,用 VSCode 完成 Git 的全部操作:安装、版本管理、分支合并、远程推送、SSH配置、冲突解决、标签管理、LFS上传大文件等。


一、前言

VSCode 不只是编辑器,更是一个 Git 可视化控制台。通过插件支持,我们可以在图形化界面中完成几乎所有 Git 操作:

  • 初始化、提交、回退
  • 分支创建与合并
  • 远程推送、拉取
  • 冲突解决与差异对比

让 Git 的复杂命令行操作变得一目了然。


二、Git 安装与环境检测

1)下载地址
Git 官方下载页https://git-scm.com/downloads

安装注意windows系统下还是Linux系统或者macos系统。

安装时建议自定义目录,C盘空间充足则可默认安装。

2)安装步骤

可以看 Git 详细安装教程(详解 Git 安装过程的每一个步骤)_git安装-ZEEKLOG博客 安装教程,写的很详细,下面借用了这里面的图。

如果之后想上传大文件到 github 的话,可以勾选 Git LFS。

其他的就一路Next ,安装结束后在文件夹右键鼠标,将在菜单看到以下图标,说明安装成功。

3)检查是否安装成功

成功安装git后,vscode页面显示这样就是安装成功了。

在 VSCode 底部终端输入:

git --version 

若输出版本号即表示安装成功。


三、VSCode Git 插件配置

建议安装以下三个核心插件:

插件名称功能
GitLens查看历史提交、比较文件、冲突解决
Git Graph分支可视化管理与合并操作
Git History Diff查看详细历史记录与差异

安装完成后,左侧侧边栏会出现“源代码管理”图标。


四、git 本地代码版本控制

4.1 设置全局 git 用户名和邮箱

第一次使用 git ,请先配置全局的用户名和邮箱(将以下命令用户名邮箱替换成你自己git用户下的)。

git config --global user.name "Your Name" git config --global user.email "[email protected]" 

配置完成后,通过以下命令确认这些信息:

git config --list 

4.2 初始化仓库

打开项目文件夹 → 点击左侧“源代码管理” → 选择 初始化仓库

此时会生成一个隐藏文件夹 .git/


4.3 暂存与提交

修改文件后,左侧会显示“更改”文件。

  • 点击 +号 暂存更改(相当于 git add
  • 在消息栏输入提交说明(用来描述你的代码变化的目的和内容的地方,方便进行浏览版本差异)
  • 点击 ✔ 提交(相当于 git commit -m "msg"
  • 若未在消息栏填写内容,就点击了提交按键,将会蹦出一个COMMIT_EDITMSG文件,在文件第一行填写注释内容,保存并关闭,也可完成文件的提交。
小提示:提交信息不能为空,否则 VSCode 会自动弹出 COMMIT_EDITMSG 文件要求填写。

4.4 VScode左侧文件栏右侧字母含义:

这里以及下方部分内容借鉴了基于 VScode 的 git 详细使用指南【保姆级!建议收藏!】_vscode使用git-ZEEKLOG博客

A:A是Added的缩写。表示这个文件是新增的,它在本地仓库中不存在,但是已经被添加到暂存区,等待提交。
U:U是Untracked的缩写。表示这个文件是未跟踪的,它在本地仓库中不存在,也没有被添加到暂存区,需要你手动添加或忽略。
M:M是Modified的缩写。表示这个文件是被修改的,它在本地仓库中存在,但是已经被修改。
D:D是Deleted的缩写。表示这个文件是被删除的,它在本地仓库中存在,但是已经被删除。
1,M:表示这个文件有一个错误,后面的字母代表该文件的状态。


4.5 文件修改与版本历史

1)修改文件时,VSCode 左侧会显示:
  • 🟢 绿色:新增内容
  • 🔵 蓝色:修改内容
  • 🔴 红色:删除内容
2)版本记录

点击“View History”即可查看版本记录(依赖 Git History 插件)。

  • Git History界面可以看见所有历史版本信息,左侧有版本名称即为你添加的注释(可以相同)和上传时间,右侧有版本的hash码(不同),是版本的唯一标识符。
  • 点击版本,可以看到该版本相比上一版本进行了哪些操作。可以看到test7版本,相比于test6版本,添加了test_02.txt、删除了text_03.h,修改了test.c
  • 点击 view,可以看到该版本的该文件的内容。
  •   点击 Workspace,可以看到该版本与 当前工作空间内容 的对比。
  • 点击 Previous ,可以看到该版本与 上一版本文件内容 的对比。
  • 点击 History ,可以看到该文件 所有被修改的历史版本。

4.7 版本对比与回退

  • 点击资源管理器时间线图标查看版本差异
  • 可进行“软回退(Soft)”或“硬回退(Hard)”
模式HEAD移动暂存区工作区
Soft移动到旧版本保留保留
Hard回退到旧版本清空清空

4.8 分支管理

创建分支

点击“源代码管理”右上角的... → “分支” → “创建分支”

或在底部状态栏直接点击当前分支名(如 main),输入新分支名即可。

切换分支

点击左下角分支名 → 选择要切换的分支
(注意:未提交的修改需先提交或撤销)

合并分支

通过 Git Graph 可视化右键 → “合并到当前分支”

或者通过可视化界面(切换到主分支,点击 源代码管理 的右上角三个点,选择分支-合并)

删除分支

git branch -d branchname

4.9 标签创建与推送

在 Git Graph 中右键任意提交 → “创建标签”。
输入版本号或标识,如 v1.0.0,再执行推送即可同步远程。


五、远程仓库管理

这里可以具体看我 Git专栏 中 《SSH公钥设置》 内容SSH 公钥设置https://blog.ZEEKLOG.net/m0_58954356/article/details/154067453

5.1 创建远程仓库

登录 GitHubGitee
→ 点击 “New repository” → 填写名称 → Create。

复制生成的 HTTPS 或 SSH 地址备用。


5.2 创建 SSH 密钥

在 VSCode 终端输入:

ssh-keygen -t rsa -C "你的邮箱"

一路回车后,会在 ~/.ssh/ 下生成:

  • id_rsa(私钥)
  • id_rsa.pub(公钥)

复制 id_rsa.pub 内容 →
进入 GitHub → Settings → SSH and GPG keys → New SSH key。


5.3 推送与拉取

添加远程仓库

git remote add origin [email protected]:yourname/repo.git

推送本地到远程

git push -u origin main

或在 VSCode 中:

源代码管理 → 同步更改(即 push + pull)

拉取远程更新

“…” → 拉取(Pull)

5.4 克隆远程仓库

复制仓库地址 → VSCode 命令面板输入:

Git: Clone 

粘贴链接即可。


六、冲突解决与代码 Review

冲突产生时
VSCode 会自动打开合并编辑器:

  • 接受当前更改
  • 接受传入更改
  • 保留双方更改

也可通过 GitLens 对比不同提交版本。
完成后重新提交即可。

代码 Review
使用 GitLens 直接查看某次提交的修改详情,对比前后代码差异,一目了然。


七、多账户管理(多 SSH 配置)

如你有多个 GitHub 账号:

1️⃣ 生成多个密钥:

ssh-keygen -t rsa -C "[email protected]" -f "id_rsa_one" ssh-keygen -t rsa -C "[email protected]" -f "id_rsa_two"

2️⃣ 配置 ~/.ssh/config

# 账号1 Host github_one HostName github.com IdentityFile ~/.ssh/id_rsa_one User git # 账号2 Host github_two HostName github.com IdentityFile ~/.ssh/id_rsa_two User git 

3️⃣ 推送时使用:

git remote add origin git@github_two:username/repo.git

八、Git 高级技巧

8.1 忽略文件 .gitignore

创建 .gitignore 文件:

# 忽略日志文件 *.log # 忽略 node_modules node_modules/ # 忽略临时文件 *.tmp # 保留 README !README.md

被忽略的文件会显示为灰色。


8.2 Git LFS 上传大文件

GitHub 限制单文件 ≤ 100MB。
大文件请使用 LFS:

git lfs install git lfs track "data/*.zip" git add .gitattributes git add . git commit -m "use lfs" git push

8.3 网络与权限问题

若 push 报错:

fatal: unable to access 'https://github.com/...': SSL_ERROR_SYSCALL

解决方案:

git config --global http.proxy http://127.0.0.1:7890 git config --global https.proxy http://127.0.0.1:7890

如无代理,取消:

git config --global --unset http.proxy git config --global --unset https.proxy

九、常用 Git 命令汇总

操作命令行VSCode操作
初始化仓库git init源代码管理 → 初始化仓库
添加暂存git add .“+” 暂存更改
提交git commit -m "msg"“✔” 提交
推送git push同步更改
拉取git pull同步更改
创建分支git branch dev右下角分支 → 新建分支
切换分支git checkout dev状态栏点击切换
合并分支git mergeGit Graph 可视化操作
回退git reset --soft/hardGit History → Soft / Hard
查看日志git logGitLens / Git Graph
删除分支git branch -d devGit Graph 删除

Read more

深入解析OpenClaw Skills:从原理到实战,打造专属机器人技能

深入解析OpenClaw Skills:从原理到实战,打造专属机器人技能

一、OpenClaw Skills:机器人行为的“最小执行单元” 1.1 什么是OpenClaw Skills? OpenClaw是面向开源机械爪/小型机器人的控制框架(核心仓库:openclaw/openclaw),旨在降低机器人行为开发的门槛。而Skills(技能) 是OpenClaw框架中对机器人“单一可执行行为”的封装模块——它将机器人完成某一特定动作的逻辑(如“夹取物体”“释放物体”“移动到指定坐标”)抽象为独立、可复用、可组合的代码单元。 简单来说: * 粒度:一个Skill对应一个“原子行为”(如“单指闭合”)或“组合行为”(如“夹取→移动→释放”); * 特性:跨硬件兼容(适配不同型号机械爪)、可插拔(直接集成到OpenClaw主框架)、可扩展(支持自定义参数); * 核心价值:避免重复开发,让开发者聚焦“

By Ne0inhk
龙虾机器人(OpenClaw)本地部署完全技术指南

龙虾机器人(OpenClaw)本地部署完全技术指南

龙虾机器人(OpenClaw)本地部署完全技术指南 前言:什么是“龙虾机器人”? 在开始部署之前,我们需要明确部署的对象。通常所说的“龙虾机器人”指的是开源项目 OpenClaw(曾用名:Clawdbot、Moltbot)。它由程序员彼得·斯坦伯格开发,是一个开源的、可本地部署的通用型AI代理系统。与ChatGPT等对话式AI不同,OpenClaw被赋予了操作系统的权限:它可以执行终端命令、读写文件、操控浏览器、安装软件,甚至通过MCP协议调用外部工具。 由于其强大的系统操控能力,安全性是部署时需关注的首要问题。官方及社区普遍建议:不要在主力机或存有敏感数据的生产环境直接裸奔部署,最好使用虚拟机、Docker容器或专用硬件(如Mac Mini或AI开发盒子)进行隔离。 第一章:环境准备与核心依赖 在安装OpenClaw之前,必须准备好运行环境。OpenClaw的核心由TypeScript编写,因此Node.js是必不可少的运行环境。此外,根据安装方式的不同,可能还需要Git、Docker或Python环境。 1.1 硬件建议与系统选择 * Linux

By Ne0inhk

将微软的 GraphRAG 集成到 Neo4j 中

原文:towardsdatascience.com/integrating-microsoft-graphrag-into-neo4j-e0d4fa00714c?source=collection_archive---------0-----------------------#2024-07-31 将 MSFT GraphRAG 输出存储到 Neo4j 中,并使用 LangChain 或 LlamaIndex 实现本地和全局检索器 https://bratanic-tomaz.medium.com/?source=post_page---byline--e0d4fa00714c--------------------------------https://towardsdatascience.com/?source=post_page---byline--e0d4fa00714c--------------------------------Tomaz Bratanic ·发布于 Towards Data Science ·16 分钟阅读·2024 年 7 月 31 日 –

By Ne0inhk

WIN11必备!QTTabBar中文优化版保姆级安装教程(含常见问题解决)

WIN11效率革命:深度定制你的资源管理器,不止于多标签 如果你和我一样,每天要在Windows的资源管理器里花费大量时间,那你一定对那种反复在层层文件夹中穿梭、找不到上一个窗口的体验深恶痛绝。系统自带的文件管理工具,就像一个功能简陋的毛坯房,勉强能用,但毫无效率与舒适度可言。尤其是升级到WIN11后,虽然界面更现代,但核心的文件管理逻辑依然停留在上个时代,对于追求效率的用户来说,这无疑是一种巨大的生产力损耗。 这篇文章,就是为那些不愿忍受现状,但又不想投入过多精力去学习复杂新软件的WIN10/WIN11用户准备的。我们不讨论那些需要彻底改变操作习惯的“重型”第三方管理器,而是聚焦于一种更优雅、更无感的解决方案:增强你正在使用的资源管理器本身。今天的主角,是一个经过国内开发者精心“魔改”的经典工具——QTTabBar的中文优化版。它就像给你的文件管理器做了一次精装修,保留了熟悉的格局,却赋予了它全新的、高效的能力。接下来,我将带你从零开始,完成这次效率升级,并深入探讨如何根据你的习惯,将它调校成最趁手的工具。 1. 为什么选择增强,而非替换? 在深入安装细节之前,我们有必要先

By Ne0inhk