兩種微軟產品可以很好地融合在一起。你可以在 VS Code 中無縫編碼并將更改推送到你的 GitHub 倉庫。從同一個應用界面完成所有這些工作讓生活變得如此輕松。
如何將 GitHub 添加到 VS Code? 其實很容易。
在本教程中,我將展示:
- 如何將你的 GitHub 帳戶集成到 VS Code 中
- 如何將倉庫從 GitHub 克隆到 VS Code 中
- 如何將你的更改從 VS Code 推送到 GitHub
聽起來不錯?讓我們看看如何去做。
先決條件
請確保你的計算機上安裝了 Git。怎么做?
一種方法是轉到 VS Code 中的源代碼管理視圖。如果未安裝 Git,它會要求你下載它。
Checking if Git is installed via VS Code
另一件事是你需要配置 Git 用戶名和電子郵件。
將 GitHub 添加到 VS Code
VS Code 內置了 GitHub 集成。你不需要安裝任何擴展來克隆倉庫和推送你的更改。
從左側邊欄轉到源代碼選項卡。你應該看到 “克隆倉庫Clone Repository” 或 “發布到 GitHubPublish to GitHub”(如果你已經打開了一個文件夾)選項。單擊 “克隆倉庫Clone Repository” 并為其提供 GitHub 倉庫鏈接或單擊 “從 GitHub 克隆Clone from GitHub”。
Cloning GitHub repo in VS Code
然后它會顯示一條消息,要求你登錄 GitHub。
VS Code asking to sign in to GitHub
你單擊“允許Allow”按鈕,它將打開 GitHub 登錄頁面。
Connect GitHub to VS Code
如果你嘗試克隆一個倉庫,你應該會看到這樣的消息并單擊 “打開Open”。
Opening GitHub repo in VS Code
這應該需要幾秒鐘,你就會登錄到你的 GitHub 帳戶。
你怎么知道你已經使用 VS Code 登錄到 GitHub?
好吧,它將開始在頂部視圖中顯示你的 GitHub 倉庫(如果有的話)(如果你之前按下了“克隆存儲庫”)。
GitHub repos accessible from VS Code
或者,你可以單擊左下角的配置文件圖標,查看它是否顯示你已登錄到你的 GitHub 帳戶。
Checking if VS Code logged into GitHub account
在 GitHub 中克隆一個 GitHub 倉庫
如果你已經在 GitHub 中打開了一個項目,想要克隆另一個 GitHub 倉庫,有幾種方法可以做到。
你可以使用 Git 命令將倉庫克隆到磁盤上,然后在 VS Code 中打開此倉庫文件夾。
或者,如果你不想使用命令行,則可以堅持使用 VS Code。
這很簡單。在 VS Code 中打開一個新窗口。
Open a new window in VS Code
這將為你提供一個全新、干凈的編輯器。如果看到歡迎屏幕,你可以從那里單擊 “克隆存儲庫” 的快速鏈接。
否則,從左側邊欄轉到“源碼管理Source Control”選項卡,然后單擊“克隆倉庫Clone Repository”按鈕。
它將在頂部打開一個視圖。你可以直接復制 GitHub 倉庫的 URL。它可以自動從中獲取克隆鏈接。
Clone a new GitHub repo in VS Code
它會問你把克隆的倉庫放在哪里。
Select a location for the cloned GitHub repo in VS Code
它會詢問你是否要將克隆的倉庫在 VS Code 中打開。如果你想立即處理它,那就去做吧。
Open the just cloned GitHub repo in VS Code
不僅僅是克隆的存儲庫,VS Code 會詢問你是否信任你添加到其中的任何文件夾的作者。
Trust author promot in VS Code
好了,你已經在 VS Code 中克隆了一個 GitHub 倉庫。讓我們看看如何修改并將更改推送到 GitHub。
從 VS Code 推送更改到 GitHub
現在假設你對代碼進行了一些更改并希望將提交推送到你的倉庫。
當你將更改保存到文件中,VS Code 就會開始用 “M” 指示修改后的文件。對于新文件,符號為 “U”(未跟蹤)。
從左側進入“源碼控制”,輸入提交消息,然后單擊提交旁邊的按鈕并選擇 “提交并推送Commit & Push”。
Push your changes to GitHub from VS Code
如果你沒有配置 Git 用戶名和電子郵件,你將看到如下錯誤。
Error in VS Code if Git username and email is not set
你可以在全局或倉庫級別設置用戶名和電子郵件。完全根據你自己的選擇。