vscode操作git

vscode & git

vscode和git的联合，完美的配合。

本人是一个忠实的vscode使用用户，毕竟他是开源的，使用electron，typescript开发的软件。是免费的，可白嫖的，还有功能强大的插件的，自己也想学习开发的梦想软件。

vscode不仅仅可以敲代码，还可以进行git版本管理。它几乎拥有souretree的所有功能，为啥不用呢？因为说的人很少。

目标：白嫖vscode

把vscode可以白嫖的git常用使用全部白嫖一边。

(本文基于已经安装好了git并且配置好了git的账户)

1、安装插件

• gitlens：虽然只能用部分功能，但足够了。
• git history：可以显示提交的commit记录，替代gitlens付费的功能
• git graph：可以显示提交的commit记录，并进行记录操作。搜索页面没有git history做的好看(仅个人看法哈)
• git-commit-plugin：commit提示(如果公司有自己的模板，可以不需要)

2、建立仓库

这个在github或者gitee，gitlib上面操作。这里暂时只说vscode里面的操作

(github使用物联网打不开😭)

3、链接仓库

A：项目从零开始

1. 进入项目文件；
2. 使用git init初始化配置；
3. 使用各种手段对配置git的提交规范，提交代码规范等等；(等我学会)
4. 第一次提交代码
5. 然后如下图[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-jFFgpopn-1680676578042)(C:\Users\y\AppData\Roaming\Typora\typora-user-images\image-20230404213812348.png)]就可以点击，然后根据框输入仓库地址，然后就可以添加一个仓库

b：参与开发中的项目

1. 使用命令拉起项目
2. 然后使用vscode打开项目

4、拉取项目

在上面的图片，已经看到了拉取按钮，点击拉取，就可以拉取项目了。

5、推送项目

在上面的图片，已经看到了推送按钮，点击推送，就可以推送项目了。

(如果没有登录，vscode会提示登录账户的)

6、查看修改区

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ASisFZQX-1680676578043)(C:\Users\y\AppData\Roaming\Typora\typora-user-images\image-20230404214625048.png)]

在这里，可以看到修改的文件

7、提交暂存区

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-LiAwJfgl-1680676578043)(C:\Users\y\AppData\Roaming\Typora\typora-user-images\image-20230404214852623.png)]

在鼠标移动到上面的对应位置，可以看见一个加号。

这三个图标分别是，打开文件，撤回修改，添加到暂存区

8、查看暂存区

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-7zgl8JFv-1680676578044)(C:\Users\y\AppData\Roaming\Typora\typora-user-images\image-20230404215739460.png)]

此时可以看到暂存的文件，同时看到新的图标减号。其他的都是上面见过的符号

简化就是把暂存区的文件退回到修改区

9、提交文件

有人把这一步叫

commit

，也有人叫提交到历史区。都是一样的操作。

可以通过上面8的图看到一个输入框和一个提交按钮，输入框就是输入commit的内容。输入完成后点击提交按钮，就完成了代码的

commit

10、提交功能

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-oKgSjXJm-1680676578044)(C:\Users\y\AppData\Roaming\Typora\typora-user-images\image-20230404220054361.png)]

上图可以看到提交的全部功能

• 提交：和左边那个大提交按钮功能一样
• 提交已暂存文件：仅仅提交在暂存区的文件，修改区的不会提交
• 全部提交：不管是修改区还是暂存区，都会提交
• 撤销上一次提交：撤销上一次提交，并把代码退回到历史区
• 提交已暂存文件(修改)：比如你已经提交过一次，然后你发现commit描述错误，或者你又修改了一些文件想一起提交，就可以使用这个。
• 全部提交(修改)：同上
• 其他：略(我现在也有点不明白已署名是啥)

11、更改功能

可以看到图10里面有更改菜单，里面功能很简单，就是字面意思。

12、分支操作

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Oe4Z5sfv-1680676578044)(C:\Users\y\AppData\Roaming\Typora\typora-user-images\image-20230404220739039.png)]

切换分支就是点击箭头指的地方，点击后会让选择切换到那个分支。同时也可以进行新分支的创建

然后也看见了分支的常用操作，增删改查合。

13、git存储

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-DteV9Ukw-1680676578044)(C:\Users\y\AppData\Roaming\Typora\typora-user-images\image-20230404220941411.png)]

有时候会遇到，开发功能开发到一半，领导让你同步代码。但是你同步后可能会有冲突。所以会很无奈的还原代码。因为自己的代码还没有开发好，也不能直接提交。

所以就需要暂时缓存一下代码

1. 存储：把当前修改代码缓存到git的缓存区里面，(注意不是暂存区)
2. 存储(包含未跟踪)：未跟踪指的是新创建的文件，还没有被commit记录过
3. 存储暂存：字面意思，略
4. 应用最新存储：将最后一次存储的内容，放到修改区
5. 应用存储：选择历史的某一次存储，放到修改区
6. 弹出最新存储：和上面”应用最新存储“基本一样
7. 弹出存储：字面意思，略
8. 删除存储：选择历史的某一次存储，进行删除
9. 删除所有存储：删除全部的存储记录

14、commit查看

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Iy7bCVlE-1680676578045)(C:\Users\y\AppData\Roaming\Typora\typora-user-images\image-20230405141444493.png)]

如上图，

• 点击第一个图标，会打开git history页面，然后可以搜索查看commit记录
• 点击第二个图标，会打开git graph页面，然后也可以搜索查看commit记录以及其他更多的操作

15、重置提交

重置到某一次

commit

提交

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-l2uFmOqo-1680676578045)(C:\Users\y\AppData\Roaming\Typora\typora-user-images\image-20230405142033091.png)]

此时就可以看到

reset current branch to this commit

，点击后会提示重置的类型。

然后根据需要进行执行，本人用的最多的就是强重置。

16、回滚某一次提交

图15可以看到

rebase current branch on this commit

，点击后会提示是否回归此次提交的代码

17、查看文件修改记录

在vscode打开需要查看的文件

此时就可以看到当前这个文件修改的所有记录了。

总结

我可以明确并清楚知道功能的几个常用的git操作都在上面了。

• 提交到暂存区
• 提交到历史区
• 补充上一次历史区的提交
• 修改上一次历史区的提交描述
• 撤回上一次历史区提交
• 存储当前修改代码
• 使用存储的代码
• 分支的切换，创建，删除
• 查看commit提交
• 重置到某次commit提交
• 回滚某次commit提交
• 查看单一文件的全部提交记录

创作不易，点赞收藏支持一下吧。😊