vsCode 源代碼管理插件GitLens使用指南 你值得收藏

相信vsCode的強(qiáng)大功能深受開發(fā)人員的喜愛,作為前端開發(fā)的我,最近一直頭疼于代碼的管理與提交,這篇文章記錄下vsCode好用的源代碼管理插件GitLen,希望能幫助到那些和我有同樣困擾的你們。?(^_-)

第一步:在vsCode的擴(kuò)展功能里搜索GitLens、Git History

pic1.png
pic2.png

下載好插件后,會出現(xiàn)
logo1.png

圖標(biāo),點(diǎn)擊查看當(dāng)前項(xiàng)目的分支情況(假設(shè)當(dāng)前你已從遠(yuǎn)程拉取項(xiàng)目至本地)


pic3.png

第二步:從遠(yuǎn)程拉取分支至本地操作

一、當(dāng)你本地?zé)o項(xiàng)目文件時,從這看起,若有,則跳過一,直接看步驟二;
  1. 新建一個空文件,文件名為proName(根據(jù)項(xiàng)目命名);
    手動新建文件夾或命令 mkdir proName
  2. 初始化項(xiàng)目 git init
  3. 與遠(yuǎn)程分支建立關(guān)聯(lián)(遠(yuǎn)程倉庫鏈接在git上)git remote add origin git@github.com:xxx/xxx.git
  4. 拉取遠(yuǎn)程分支至本地 git fetch origin dev(dev為遠(yuǎn)程倉庫的分支名)
  5. 創(chuàng)建本地分支并關(guān)聯(lián)到遠(yuǎn)程分支 git checkout -b dev(本地分支名) origin/dev(遠(yuǎn)程分支名)

至此,本地分支dev已與遠(yuǎn)程分支建立關(guān)聯(lián),并拉取dev分支項(xiàng)目,git pull可拉取項(xiàng)目遠(yuǎn)程所有分支,可通過如下命名查看本地分支及遠(yuǎn)程分支情況。

git branch 查看本地分支
git branch -a 查看當(dāng)前所在分支及遠(yuǎn)程分支
git branch -r 查看遠(yuǎn)程分支
git branch -vv 查看本地分支與遠(yuǎn)程分支的關(guān)聯(lián)關(guān)系

二、本地已有項(xiàng)目時,點(diǎn)擊
logo2.png

圖標(biāo),就可查看當(dāng)前項(xiàng)目的分支情況,一目了然。


pic4.png

當(dāng)修改本地文件內(nèi)容時,已修改文件可通過如下步驟查看,點(diǎn)擊對應(yīng)的文件可通過Working Tree查看已修改情況。

第三步:代碼提交、分支切換、合并、歷史分支查看

一、代碼提交

點(diǎn)擊

logo3.png

圖標(biāo),可暫存已修改文件,在輸入框中輸入日志內(nèi)容,ctrl+enter,然后點(diǎn)擊vsCode編輯器左下角的圖標(biāo),
logo4.png

即可提交至遠(yuǎn)程;
pic5.png

以上提交代碼至遠(yuǎn)程步驟等同于如下命令:

  1. git add . 暫存當(dāng)前分支所有本地修改的文件
  2. git commit -m 'logs' 提交本次修改的日志logs
  3. git push 將本地修改內(nèi)容提交至遠(yuǎn)程
二、分支切換

點(diǎn)擊當(dāng)前項(xiàng)目所在分支, 顯示該項(xiàng)目可切換的遠(yuǎn)程分支,選擇要切換的分支,即可在本地創(chuàng)建與遠(yuǎn)程分支同名的分支并與之關(guān)聯(lián)。


pic6.png

pic4.png中的Branches中會新增一個分支,也可通過如下命令查看;

git branch可查看本地會多一個分支
git branch -vv可查看本地新增的分支與遠(yuǎn)程分支關(guān)聯(lián)

以上步驟等同于命令 git checkout -b dev(本地分支名) origin/dev(遠(yuǎn)程分支名)

三、分支合并

1、若協(xié)作開發(fā),各分支之間無沖突,可提交代碼至遠(yuǎn)程后,至git上merge分支到上線分支,無須本地合并操作。


pic7.png

pic8.png

2、若合并有沖突,則需拉取分支代碼至本地,解決沖突,再push到線上。假設(shè)有沖突的分支是本地分支local與遠(yuǎn)程分支dev,步驟如下:

  1. 切換本地分支至dev,git pull下;
  2. git merge dev
  3. 解決沖突-手動
  4. 代碼提交(參照一、代碼提交
四、歷史分支查看

點(diǎn)擊文件右側(cè)圖標(biāo),可查看git log 歷史記錄


pic9.png
pic10.png

額外附上git常用命令,我們不可只會借用工具操作而不會常用的命令

git status 查看當(dāng)前分支狀態(tài)
git diff dev(本地分支) remote(遠(yuǎn)程分支) 比較本地分支與遠(yuǎn)程分支區(qū)別
git log 查看提交日志
如果嫌輸出信息太多,看得眼花繚亂的,可以試試加上--pretty=oneline參數(shù);

版本回退

版本回退需注意git revertgit reset的區(qū)別

  • git revert
    git revert 撤銷某次操作,此次操作之前和之后的 commit 和 history 都會保留,并且把這次撤銷作為一次最新的提交。git revert是提交一個新的版本,將需要revert的版本的內(nèi)容再反向修改回去,版本會遞增,不影響之前提交的內(nèi)容。
  1. 當(dāng)代碼已經(jīng)commit但沒有push時,可使用如下命令操作:
    git revert HEAD //撤銷倒數(shù)第一次提交
    git revert HEAD^ //撤銷倒數(shù)第二次提交
    git-revert HEAD~2 //撤銷倒數(shù)第三次提交
    git revert commit //(比如:fa042ce57ebbe5bb9c8db709f719cec2c58ee7ff)撤銷指定的版本,撤銷也會作為一次提交進(jìn)

  2. 當(dāng)代碼已經(jīng)commit并push時,可使用如下命令:
    git revert HEAD~1 //代碼回退到前一個版本

當(dāng)回退有沖突時,需手動合并沖突并進(jìn)行修改,再 commit 和 push。這相當(dāng)于增加了一次新的提交并且版本庫中有記錄。

  • git reset
    git reset 是撤銷某次提交,但是此次之后的修改都會被退回到暫存區(qū)。除了默認(rèn)的 mixed 模式,還有 soft 和 hard 模式。
  1. 如果我們的有兩次 commit 但是沒有 push 代碼
git reset HEAD~1      //撤銷前一次 commit,所有代碼回到 Working Copy
  1. 假如我們有幾次代碼修改,并且都已經(jīng) push 到了版本庫中。
git reset --hard HEAD~2   //本地的Wroking Copy回退到2個版本之前。
  1. 只回退某個指定文件到指定版本
git reset a4e215234aa4927c85693dca7b68e9976948a35e  xxx

4.回退到指定版本

git reset --hard commitId(通過git log可查看提交的commitId)

如果你使用的是webstorm,它也有很好用的git插件,比vsCode的GitLens好使,也有人說webstorm比較重,不喜歡;當(dāng)然,個人選擇,隨意。僅附一圖對比。


pic11.png

希望上面整理的操作可以幫助到你,后續(xù)也會持續(xù)更新git常用的命令及操作,如果覺得有用,請點(diǎn)個贊?。?!?(^_-)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容