VS Code 中使用 Git 實踐，學會了效率翻倍！

將 Git 和 VS Code 結合使用，以可視化方式更加輕鬆地進行代碼管理、協作和追蹤變更。不必依賴繁瑣的命令行操作，VS Code 提供了直觀的圖形界面和擴展來簡化 Git 的使用。本文來一起學習如何在 VS Code 中進行常見的 Git 可視化操作！

前置工作

在介紹如何在 VS Code 中使用 Git 之前，先來介紹一個強大的 VS Code 插件：Git Extension Pack，它旨在提供一組常用的 Git 工具和功能，以便更方便地進行版本控制和協作開發。該插件包含了多個與 Git 相關的擴展：

• Git History (git log)：可以查看 Git 提交記錄、文件或行的歷史。通過該擴展，可以快速瀏覽項目的版本歷史，查看每個提交包含的修改內容和作者信息，以及文件和行的詳細變更情況。

• Project Manager：可以方便地在不同項目之間進行切換。這個擴展提供了一個項目管理器，可以輕鬆地保存和加載不同的項目配置，快速切換工作環境。

• GitLens：增強了 Visual Studio Code 內置的 Git 功能。它通過行內的 Git 責任註解和代碼鏡頭，更好地瞭解代碼的歷史和作者信息。您可以方便地查看每行代碼的最後修改者、最近的提交信息，甚至可以直接查看遠程倉庫上的相關代碼片段。

• gitignore：提供了對 .gitignore 文件的語言支持，讓您能夠更簡單地管理和生成這個文件。同時，還可以從 GitHub 的存儲庫中獲取常見的 .gitignore 文件模板，以便快速忽略項目中不需要跟蹤的文件和文件夾。

• Open in GitHub / Bitbucket / VisualStudio.com：提供了在 GitHub、Bitbucket 或 VisualStudio.com 中直接跳轉到代碼的功能。通過單擊相應的鏈接，可以快速打開相關代碼倉庫，並跳轉到指定的行號或文件位置。

一個插件囊括了五個熱門插件的全部功能！

安裝完成之後，就來看看如何在 VS Code 中可視化使用 Git。

當新打開一個 VS  Code 窗口時，需要打開一個項目，可以在本地文件打開項目，也可以直接從遠程倉庫克隆項目：

當選擇從遠程克隆倉庫時，輸入遠程倉庫地址，按下回車即可：這裏可以輸入 Git 鏈接來克隆，可以是 Github、Gitlab、GItee，或者私有部署的 Git 倉庫鏈接。也可以選擇從 Github 遠程倉庫克隆，只需登錄 Github，輸入查找自己的倉庫，然後進行克隆即可。

克隆完成之後，會將文件存儲在本地，直接打開即可。

git clone

在 Git 中，分支允許同時處理代碼庫的多個版本。可以在源代碼管理邊欄的最下面看到當前所在的分支：

git branch

如果這個分支沒有變動，只會顯示一個分支名，如果有修改，分支名的右上角會有一個 *，就像這樣：

要想切換分支，需要點擊這個分支名稱，就會出現所有分支的列表：可以看到，這裏面有兩類分支，一類是帶分支圖標的，另一類是帶雲圖標的。前者表示本地分支，後者表示遠程分支。點擊本地分支，就會切換到對應的分支，點擊遠程分支，就會遠程分支同步到本地，並在本地創建一個同名的分支。

如果想重命名分支，可以執行以下操作：

點擊之後，輸入新的分支名即可。

如果分支不需要了，也可以刪除分支，不過需要注意，如果想刪除某個分支，需要先切換到別的分支。

點擊刪除分支，然後選擇要刪除的分支即可。

git rebase

可以按照以下步驟來執行變基操作：

git checkout

最上面有兩個分支創建操作，第一個是從當前分支創建一個新分支，輸入新分支名即可創建。第二個是從指定分支創建一個新分支，需要先選取從哪個分支創建，然後輸入新分支名即可：

如果是使用第一種方式來創建新分支，那當前分支的更改也會帶到新分支上。

git merge

如果想要合併分支，可以執行以下操作：

點擊之後，需要選擇從哪個分支向當前分支進行合併，選擇被合併的分分支即可。

git push

新創建的分支可以點擊 “發佈 Branch” 按鈕來發布到遠程倉庫：

當我們進行代碼的修改之後，在源代碼管理邊欄中可以看到更改的文件：

• 如果是刪除某個文件，那在更改中顯示的文件名上會有一個刪除線，並且最後會有一個 D 標誌，表示已刪除；

• 如果是修改某個文件，那在更改中顯示的文件名最後有個 M 標誌，表示已修改，如果這個文件存在代碼檢查的錯誤，會在 M 前顯示錯誤的數量，比如上面的 package.json 中就有 1 個錯誤。

• 如果是新增一個文件，那在更改中顯示的文件名最後有個 U 標誌，表示未跟蹤的，因爲是新增的文件，所以是未跟蹤。

git add

如果想暫存所有文件，可以鼠標懸浮在 “更改” 那一行，並點擊後面的 ➕ 即可：

如果只是想暫存某些文件，可以鼠標懸浮在需要更改的文件名上，並點擊後面的 ➕ 即可：這個暫存操作就相當於執行 git add 命令。這裏暫存其中兩個，暫存完之後是這樣的：

git reset

如果想取消更改，只需點擊更改後面的撤銷按鈕（全部撤銷）或者文件後面的撤銷按鈕（撤銷單個）即可：

git commit

對於暫存的文件，可以進行 commit 操作。只需在上面的輸入框輸入 commit 信息，然後點擊 “提交” 按鈕即可：

對於未 commit 的文件，也是可以撤銷的，只需點擊暫存的更改那一行的➖或者需要撤銷的文件後面的➖，點完之後，這些文件就會回到更改中，可以繼續進行修改：

git stash

可以看到，無論是更改中，還是在暫存的更改中，都會有一個類似於撤回的按鈕，比撤回按鈕多了一個➕，這個按鈕就是 stash 的意思，也就是把當前的修改暫存起來，然後在需要的時候取出來暫存的內容，以繼續進行修改。當我們在開發一個需求過程中，需要緊急去別的分支進行操作，就可以先把已經更改的內容暫存起來，等再回來開發的時候，取出來這些內容，繼續開發即可。

這裏我們將暫存的更改和更改都先暫存起來。可以選擇彈出最新的（最後一次暫存）暫存，也可以選擇性彈出暫存：可以看到，VS Code 支持儲藏暫存、應用暫存、彈出暫存、刪除暫存。這裏不再一一介紹。

值的注意是，在源代碼管理邊欄中，也可以點擊最下面的 STASHES 來查看已暫存的文件：

這裏，可以進行應用暫存、刪除暫存、修改暫存名稱等操作：

git push

當我們修改完代碼之後，就需要推送代碼到遠程了，可以點擊藍色的同步更改按鈕，也可以點擊下面分支的更改按鈕，來同步更改。

可以看到藍色按鈕的↑箭頭旁邊有一個數字，它表示 commit 的數量。如果遠程分支比本地分支領先，還有又一個↓箭頭，旁邊也會有一個數字，表示遠程分支比本地分支領先的 commit 數量。

git pull

如果需要從遠程分支向本地分支同步代碼，可以點擊拉取：

git tag

可以點擊創建標記來創建標籤：

當然，也可以在下面的 TAGS 中管理所有標籤：

合併衝突

當合並代碼出現衝突時，VS Code 中會顯示當前的更改的和傳入的更改，可以選擇保留其中一個，也可以全部保留：

本文由 Readfog 進行 AMP 轉碼，版權歸原作者所有。
來源：https://mp.weixin.qq.com/s/PQwMcpDVhKTAci7WDjK9tQ