一文吃透 VS Code+Git 操作(vs code中git的相关配置与使用)(1)

简介: 一文吃透 VS Code+Git 操作(vs code中git的相关配置与使用)(1)

一、搭建 GIt 环境(Windows)

1. 先下载安装 GIt, 随后注册 Git 用户名与邮箱,此步骤在往期文章已有讲述,此处不再赘述;


一文带你精通 Git(Git 安装与使用、Git 命令精讲、项目的推送与克隆)_Developer 小马的博客-CSDN博客

本文详细介绍了GIT的使用方式,包括GIT介绍、安装、相关的命令解释,还有项目上传至云端与克隆至本地。

https://blog.csdn.net/weixin_53072519/article/details/122824860


2. 生成 SSH 公钥与密钥;


       右键打开 Git Bash Here;

image.png



使用命令 ls .ssh 检查我们的目录下是否已经有公钥和私钥(如下是没有的);

image.png


创建公钥和私钥,使用命令 ssh-keygen -t rsa -C "邮箱";

image.png


此时公钥私钥已经生成,注意提示的路径;

image.png



3. 将公钥添加到 GitHub/Gitee;


       复制公钥;

image.png


进入 Gitee --> "设置" --> “SSH 公钥”,添加新的公钥;

image.png


添加成功后如下;

image.png


4. 测试 SSH 连接;


       使用命令 ssh -T git@gitee.com 进行测试,出现 hi... 字样,即连接成功;


       同样在使用 GIthub 时使用命令 ssh -T git@github.com 即可;

image.png


二、VS Code 中 GIt 相关操作

(在这里我将使用一个空文件夹 git 作为项目文件进行相关的演示操作。)


本地类操作

1. 准备项目文件并初始化仓库

       新建项目文件夹 git 作为项目;桌面进入 Git Bash Here,输入命令 code git 使用 vs code 打开我们的项目文件夹;

image.png


vs code 中进入源代码管理,点击存储库的初始化。这步也就完成了 git 仓库的初始化,此时可以看到文件夹已有 .git 文件夹(默认隐藏,需要设置显示隐藏文件即可看到);

image.png



随后在项目文件 git 中新建文件 demo.html;

image.png



此时我们可以看到新建的文件为绿色,且后面有 U 字提示;U 意为 Untracked 未追踪,也就是说此文件目前仅在我们本地,未被 git 进行跟踪。

image.png



2. 添加文件至暂存区

       进入源代码管理,点击所要操作文件后面的 “+”,即可将文件添加至暂存区,相当于执行命令 git add;

image.png



此时文件名仍然为绿色,但是后面的 U 变成了 A,A 则意为此文件已在暂存区。

image.png



3. 提交暂存区文件至 git 仓库

       将暂存区的文件提交至 git,进入源代码管理,在消息框中输入相关备注,然后点击 “√” 即可进行一次提交,也可使用 Ctrl+Enter 快捷键直接提交;


image.png


此时文件颜色变为正常,且无字母提示,说明文件已提交至 git。

image.png


       提交也可使用快速提交方式,所谓快速提交就是将新文件或者修改后的文件直接提交,而不用先保存至暂存区。省略了添加至暂存区操作;


如下,如果我们将修改后的文件未保存至暂存区就进行了提交,vs code 会给出警告,这时我们选择“总是”,即可在未来的操作中自动省略添加至暂存区操作。

image.png


4. 修改提交后的文件

       将提交后的文件内容进行修改后,文件名称会有如下提示;

image.png


此时文件名变为黄色,且有提示字母 M;M 意为 modify,即已修改。

image.png



想要撤销修改,进入源代码管理,点击返回箭头放弃更改即可;


5. 查看/新建/切换分支

       点击 vs code 底部状态栏的 “master” 即可显示项目中的分支,此处的 master 意为当前所在分支为 master;如下图所示,项目中只有一个 master 分支;

image.png


创建分支点击 “+ 正在创建新分支...”;

image.png


此时项目中已有两个分支;

image.png


切换分支只需点击对应分支名称即可;


6. 合并分支

       我们先在新建的 xiaoma 分支中修改文件内容并提交;

image.png


随后切换到 master 分支,此时 master 分支是没有修改后的内容的;

image.png


接下来进行合并,首先点击设置图标 “⚙” 打开命令面板;

image.png


在命令面板中搜索 git merge,找到合并分支操作,点击合并分支;

image.png


此时 master 分支已有 xiaoma 的相关操作;

image.png


7. 临时保存当前分支状态

       当我们在工作过程中代码写到一半,并没有完成某个模块的开发,而这时又不得不离开当前分支切换到另一个分支时,就需要将当前分支的状态进行临时保存(储藏、藏匿),相当于 git 命令 git stash;


当在当前分支做了一定的修改后,点击更多 “···”,找到存储-->储藏;

image.png


8. 查看当前文件做了哪些修改

       当我们正在修改已经提交到 git 的文件内容时,vs code 会即使提示我们做了哪些操作,相当于 git 命令 git diff,如下:


蓝色代表此处已经被修改或者删除

绿色代表此处代码为新增内容


相关文章
|
22天前
|
开发工具 git C++
【App Service】VS Code直接部署App Service时候遇见 “fatal: not a git repository (or any of the parent directories): .git”
通过VS Code发布Python App Service的时候,遇见了发布失败错误: The deployment failed with error: fatal: not a git repository (or any of the parent directories): .git . Please take a few minutes to help us improve the deployment experience
72 24
|
6天前
|
Ubuntu Shell 开发工具
ubuntu/debian shell 脚本自动配置 gitea git 仓库
这是一个自动配置 Gitea Git 仓库的 Shell 脚本,支持 Ubuntu 20+ 和 Debian 12+ 系统。脚本会创建必要的目录、下载并安装 Gitea,创建 Gitea 用户和服务,确保 Gitea 在系统启动时自动运行。用户可以选择从官方或小绿叶技术博客下载安装包。
20 2
|
12天前
|
算法 网络安全 开发工具
[Git]关联远程库的两种方法及配置
本文介绍了 git 的四种连接方式:ssh 连接、HTTPS 连接、SVN 连接和 SVN + ssh 连接,重点讲解了 HTTPS 和 ssh 连接方式的配置及注意事项。文章详细解释了 HTTPS 连接的身份验证过程、常见问题及解决方案,以及 ssh 连接的公钥和私钥的创建、配置方法。此外,还介绍了如何在同一台电脑上连接多个 gitee 账号的方法。
43 0
[Git]关联远程库的两种方法及配置
|
16天前
|
JavaScript 前端开发 开发者
如何在 Visual Studio Code (VSCode) 中使用 ESLint 和 Prettier 检查代码规范并自动格式化 Vue.js 代码,包括安装插件、配置 ESLint 和 Prettier 以及 VSCode 设置的具体步骤
随着前端开发技术的快速发展,代码规范和格式化工具变得尤为重要。本文介绍了如何在 Visual Studio Code (VSCode) 中使用 ESLint 和 Prettier 检查代码规范并自动格式化 Vue.js 代码,包括安装插件、配置 ESLint 和 Prettier 以及 VSCode 设置的具体步骤。通过这些工具,可以显著提升编码效率和代码质量。
164 4
|
1月前
|
Ubuntu Linux 编译器
Linux/Ubuntu下使用VS Code配置C/C++项目环境调用OpenCV
通过以上步骤,您已经成功在Ubuntu系统下的VS Code中配置了C/C++项目环境,并能够调用OpenCV库进行开发。请确保每一步都按照您的系统实际情况进行适当调整。
255 3
|
1月前
|
Java Linux 开发工具
IDEA中git提交前如何关闭code analysis以及开启格式化代码
【10月更文挑战第12天】本文介绍了在 IntelliJ IDEA 中关闭代码分析和开启代码格式化的步骤。关闭代码分析可通过取消默认启用检查或针对特定规则进行调整实现,同时可通过设置 VCS 静默模式在提交时跳过检查。开启代码格式化则需在 `Settings` 中配置 `Code Style` 规则,并通过创建 Git 钩子实现提交前自动格式化。
162 3
|
1月前
|
开发工具 git
git显示开发日志+WinSW——将.exe文件注册为服务的一个工具+图床PicGo+kubeconfig 多个集群配置 如何切换
git显示开发日志+WinSW——将.exe文件注册为服务的一个工具+图床PicGo+kubeconfig 多个集群配置 如何切换
37 1
|
2月前
|
网络协议 开发工具 网络虚拟化
SourceTree git 配置代理
SourceTree git 配置代理
61 1
|
1月前
|
编译器 网络安全 开发工具
git学习五:切换本地仓库出现的问题。修改git配置初始化。error:src refspec master does not match any。错误总结,送上几个案例
这篇文章是关于Git使用中遇到的一些问题及其解决方案的总结,包括切换本地仓库时的问题、修改Git初始化配置、以及解决"error: src refspec master does not match any"错误等。
51 0
|
3月前
|
JavaScript 前端开发 编译器
TypeScript教程(一)在vscode中的配置TypeScript环境
本文是一篇TypeScript入门教程,介绍了在VS Code中配置TypeScript环境的步骤,包括安装Node.js、使用npm安装TypeScript、配置npm镜像源、安装VS Code的TypeScript扩展,以及创建和运行一个简单的TypeScript "Hello World"程序。
TypeScript教程(一)在vscode中的配置TypeScript环境