VS Code使用Git可視化管理源代碼詳細教程

前言：

　　隨着VS Code的功能和插件的不斷強大和完善，它已經成爲了咱們平常開發中一個必不可缺的夥伴了。在以前我曾經寫過一篇SourceTree使用教程詳解（一個git可視化管理神器，想要了解的話能夠點擊查看詳情），這篇文章主要是對VS Code如何使用Git可視化管理咱們的程序源代碼。

VS Code簡介：

官網下載地址：

https://code.visualstudio.com/

　　Visual Studio Code是一個輕量級但功能強大的源代碼編輯器，可在您的桌面上運行，而且可用於Windows，macOS和Linux。它具備對JavaScript，TypeScript和Node.js的內置支持，並具備豐富的其餘語言（例如C ++，C＃，Java，Python，PHP，Go）和運行時（例如.NET和Unity）擴展的生態系統。VS Code內置了對Git的支持，可使用圖形化界面方便的進行版本控制，好比添加暫存，提交更新，拉取遠程代碼，推送代碼到遠程代碼庫，建立合併分支，文件內容差別比較等這些常規操做。

環境準備：

一、首先須要如今安裝Visual Studio Code。

下載地址：https://code.visualstudio.com/Download

選擇對應的平臺進行安裝（我本身是安裝的window平臺）：

 

二、Git環境安裝：

Git安裝詳細教程：https://blog.csdn.net/qq_43715354/article/details/108638061 

克隆GitHub中的存儲庫：

一、複製GitHub存儲庫的SSH連接地址：

二、打開VS Code點擊克隆，粘貼SSH連接地址進行下載：

查看當前所在分支：

一、界面查看：

二、切換到終端，命令查看：

git branch -a

[*重要]實際工做開發四步曲（添，提，拉，推）:

首先要明白四步曲分別是哪四步，其做用分別是什麼？

添：將修改的內容添加到本地暫存區 git add。
提：將本地暫存區中的內容提交到本地代碼庫 git commit -m 'description'。
拉：同步，拉取遠程代碼庫中的內容，在多人協同開發中十分的重要，由於假如事先沒有同步更新到最新版本有可能會覆蓋別人修改的東西，假如拉取後有衝突直接使用VS Code解決衝突便可 git pull。
推：將本地代碼庫中的內容推送到遠程代碼倉庫 git push。

添加暫存區：

新增Information.txt文本文件，添加至本地暫存區。

提交本地代碼庫：

 

 

拉取同步遠程最新代碼庫：

推送至遠程代碼庫：

 

驗證是否推送成功，查看GitHub中的倉庫內容：

衝突解決：

 　　接下來咱們來本身模擬一下多人開發，如：我在本地修改Information.txt文本文件的內容，而後在到GitHub中修改一次這樣本地在提交的時候就會產生衝突，而後咱們能夠藉助VS Code智能的解決衝突的方式幫助咱們來解決衝突。

本地修改：

 

 GitHub中的修改：

 

 本地提交後，拉取時提示衝突以下：

 

 合併衝突提交到遠程代碼庫中：

VS Code提供了四種智能合併的方式供給咱們選擇，咱們能夠按照實際狀況進行代碼衝突解決。固然也能夠手動刪除解決，不過要慎重，可能一不當心就把同事辛辛苦苦寫了幾天的代碼給覆蓋了哦，這裏我選擇了【保留雙方更改】的方式進行衝突解決。

 

衝突完美解決：

建立分支並推送到遠程代碼庫：

一、切換到源代碼管理視圖：

二、選擇須要建立子分支的主分支：

注意：咱們這裏爲develop分支建立feature-20210218分支。

 

三、將新建分支推送到遠程代碼庫：

 

 

子分支開發完成後合併到主分支中：

首先咱們在feature-20210218子分支中建立一個文件夾和一個文本文件，而後將feature-20210218子分支合併到develop開發分支中合併提交到遠程代碼庫。

一、feature-20210218子分支中建立一個文件夾和一個文件：

二、使用實際工做開發四步曲（添，提，拉，推）教程將新添加的內容推送到遠程代碼庫：

切換到feature-20210218分支：

 

 查看文件是否提交成功：

三、將feature-20210218子分支合併到develop開發分支：

a.首先切換到develop分支中：

 

b.選擇須要合併過來的分支：

 

 

 

 

 

 c.推送至遠程倉庫，查看合併是否成功：

 VS Code Git提交修改歷史記錄查看（甩鍋專用）：

須要安裝Git History拓展。

 查看對應文件的修改歷史記錄：

 

查看文件修改時間線對比文件修改內容：