相信vsCode的强大功能深受开发人员的喜爱,作为前端开发的我,最近一直头疼于代码的管理与提交,这篇文章记录下vsCode好用的源代码管理插件GitLen,希望能帮助到那些和我有同样困扰的你们。❥(^_-)
第一步:在vsCode的扩展功能里搜索GitLens、Git History
pic1.png
pic2.png
下载好插件后,会出现
logo1.png
图标,点击查看当前项目的分支情况(假设当前你已从远程拉取项目至本地)
pic3.png
第二步:从远程拉取分支至本地操作
一、当你本地无项目文件时,从这看起,若有,则跳过一,直接看步骤二;
新建一个空文件,文件名为proName(根据项目命名);
手动新建文件夹或命令mkdir proName初始化项目git init与远程分支建立关联(远程仓库链接在git上)git remote add origin git@github.com:xxx/xxx.git拉取远程分支至本地git fetch origin dev(dev为远程仓库的分支名)创建本地分支并关联到远程分支git checkout -b dev(本地分支名) origin/dev(远程分支名)
至此,本地分支dev已与远程分支建立关联,并拉取dev分支项目,git pull可拉取项目远程所有分支,可通过如下命名查看本地分支及远程分支情况。
git branch查看本地分支
git branch -a查看当前所在分支及远程分支
git branch -r查看远程分支
git branch -vv查看本地分支与远程分支的关联关系
二、本地已有项目时,点击
logo2.png
图标,就可查看当前项目的分支情况,一目了然。
pic4.png
当修改本地文件内容时,已修改文件可通过如下步骤查看,点击对应的文件可通过Working Tree查看已修改情况。
第三步:代码提交、分支切换、合并、历史分支查看
一、代码提交
点击
logo3.png
图标,可暂存已修改文件,在输入框中输入日志内容,ctrl+enter,然后点击vsCode编辑器左下角的图标,
logo4.png
即可提交至远程;
pic5.png
以上提交代码至远程步骤等同于如下命令:
git add .暂存当前分支所有本地修改的文件git commit -m 'logs'提交本次修改的日志logsgit push将本地修改内容提交至远程
二、分支切换
点击当前项目所在分支, 显示该项目可切换的远程分支,选择要切换的分支,即可在本地创建与远程分支同名的分支并与之关联。
pic6.png
pic4.png中的Branches中会新增一个分支,也可通过如下命令查看;
git branch可查看本地会多一个分支
git branch -vv可查看本地新增的分支与远程分支关联
以上步骤等同于命令git checkout -b dev(本地分支名) origin/dev(远程分支名)
三、分支合并
1、若协作开发,各分支之间无冲突,可提交代码至远程后,至git上merge分支到上线分支,无须本地合并操作。
pic7.png
pic8.png
2、若合并有冲突,则需拉取分支代码至本地,解决冲突,再push到线上。