在 Visual Studio Code 中複製和使用 GitHub 存放庫

瞭解使用 Visual Studio Code 將公用存放庫從 GitHub 複製到本機電腦的步驟。

開啟遠端存放庫

在本機電腦上開啟遠端存放庫。

活動列

1. 安裝遠端儲存庫擴充功能
2. 選取 Visual Studio Code 左下方的遠端指標。
3. 遵循提示。

狀態列

此功能不支援此操作。 選擇不同的索引標籤。

命令選擇區

1. 使用 Ctrl + + 的按鍵組合開啟命令選擇區。
2. 在命令選擇區提示字元中，輸入 gitcl，選取 Git: Clone 命令，然後選取 Clone from GitHub，按 Enter。
3. 當系統提示您輸入 儲存庫 URL 時，請從 GitHub 選取克隆，然後按 Enter。
4. 如果系統要求您登入 GitHub，請完成登入程式。
5. 在 [存放庫 URL] 字段中輸入 azure-samples/js-e2e-express-server。
6. 選取 [或建立] 您要複製專案的本機目錄，然後選取 [ 選取為存放庫目的地]。
7. 當您收到詢問是否要開啟複製存放庫的通知時，請選取 [ 開啟]。

整合式終端

1. 從終端機 -> 新終端機開啟整合式終端機。

2. 使用下列 git 命令複製存放庫：

   git clone https://github.com/<ACCOUNT>/<REPOSITORY>
   

3. 在 Visual Studio Code 中開啟：

   code <REPOSITORY>
   

Visual Studio Code 會使用作業系統所提供的 Git 驗證（例如 macOS KeyChain 或 Windows 認證管理員），搭配任何 Git 功能。 命令面板中，選擇 > Git：顯示 Git 輸出，即可看到輸出結果。

連接到自訂 GitHub 域

根據預設，Visual Studio Code 會假設您的存放庫裝載在 github.com上。 如果您需要連線到不同網域上的存放庫（例如，企業 GitHub，例如 github.<company_name>.com），則必須據以設定 Git 路徑。

若要更新 VS Code 中的 Git 路徑，請開啟 [檔案→喜好設定] → [設定]，然後搜尋 Git: Path。 此設定可讓您指定與自定義 GitHub 網域搭配運作之 Git 可執行文件的絕對路徑。

或者，您可以直接在 settings.json 檔案中新增或更新 git.path 設定，以確保 VS Code 對所有存放庫作業使用正確的 Git 二進位檔。

開啟本機存放庫

如果您的本機電腦上有現有的存放庫，而且想要在 Visual Studio Code 中開啟它，只要開啟資料夾即可。 Visual Studio Code 會辨識 .git 子資料夾，並顯示相關信息。

活動列

1. 選取 Ctrl + K + O。
2. 選取資料夾。

狀態列

此功能未提供此動作。 選擇不同的索引標籤。

命令選擇區

1. 使用 Ctrl + + 的按鍵組合開啟命令選擇區。
2. 使用 Git過濾 ，然後選擇 。 Open repository
3. 選取要選取的資料夾作為存放庫的根目錄。

整合式終端

1. 開啟終端機 -> 新終端機中的整合式終端機。

2. 開啟存放庫目錄的新 Visual Studio Code 實例：

   code ../dir1/dir2/my-repo
   

初始化新的存放庫

使用下列步驟來建立具有 git 的本機原始程式碼存放庫。

活動列

1. 從活動列選取原始程式碼管理，或使用 Ctrl + + + 的按鍵組合。

2. 選取 [ 初始化存放庫]。

   

狀態列

該功能不支援此動作。 選取不同的索引標籤。

命令選擇區

1. 使用 Ctrl + + 的按鍵組合開啟命令選擇區。
2. 使用 Git過濾 ，然後選擇 。 Initialize repository
3. 選取要選取的資料夾作為存放庫的根目錄。

整合式終端

1. 從 終端機 -> 新終端機開啟整合式終端機。

2. 使用下列 git 命令將您的資料夾初始化：

   git init
   

初始化存放庫之後， 請在 GitHub 上建立存放庫。 然後，從命令面板將該存放庫新增為遠端至本機專案：搜尋 Git: Add remote。

為變更建立一個分支

建立新的分支來擷取變更，並從主要或預設分支隔離。

活動列

1. 從活動列選取原始碼控制。
2. 選取 原始檔控制旁的省略號（...）。
3. 選取 分支 ->建立分支。

狀態列

1. 選取狀態列中的分支名稱。 這會開啟命令選擇區。

   狀態列位於Visual Studio Code底部。

2. 在命令選擇區中，選取 [+建立新的分支]。

3. 輸入您的新分支名稱。

4. 輸入新的分支名稱。 分支名稱會顯示在狀態列中。

   

命令選擇區

1. 使用 Ctrl + + 的按鍵組合開啟命令選擇區。

2. 搜尋git branch並選擇Git: Create Branch。

   

3. 輸入新的分支名稱，例如 test。

4. 分支名稱會顯示在狀態列中。

   

整合式終端

1. 從 終端機 -> 新終端機 開啟整合式終端。

2. 使用下列 git 命令建立名為 MY-BRANCH 的新分支：

   git checkout -b MY-BRANCH
   

在本機提交變更

在對分支上的檔案進行變更之後，請提交變更。

活動列

1. 從活動列選取原始檔控制。

2. 輸入您的認可訊息，然後選取 [ 認可]。

   

狀態列

此功能無法執行該動作。 選取不同的索引標籤。

命令選擇區

1. 使用 Ctrl + + 的按鍵組合開啟命令選擇區。
2. 在命令面板中，篩選Git，然後選擇Commit。
3. 輸入您的認可訊息，然後按 Enter。

整合式終端

1. 從 終端機 -> 新終端機 開啟整合終端機。

2. 使用下列 git 命令建立名為 MY-BRANCH 的新分支：

   git commit -m "YOUR COMMIT MESSAGE"
   

將本機分支推送至 GitHub

活動列

1. 從活動列選取 [原始檔控制] 圖示。
2. 選取 發佈分支。 如果 GitHub 上沒有存放庫，它會為您建立存放庫。

狀態列

1. 在 Visual Studio Code 狀態列上，選取分支名稱右邊的推播圖示。

   

2. 從彈出方塊中選取遠端名稱。 如果您只有一個遙控器，則不會要求您選取遙控器名稱。

命令選擇區

1. 使用 Ctrl + + 的按鍵組合開啟命令選擇區。
2. 在命令選擇區中，使用Git進行篩選，然後選取Push。
3. 如果您有多個上游遠端，請選擇遠端名稱，然後按 Enter。

整合式終端

1. 從 終端機 -> 新終端機開啟整合式終端機。

2. 使用下列 git 命令建立名為 MY-BRANCH 的新分支：

   git push <remote-name> <branch-name>
   

檢視 Git 輸出

您可以使用原始檔控制延伸模組來檢視 Git 命令輸出。 當命令失敗時，此輸出有助於偵錯。

1. 從活動列選取 [原始檔控制] 圖示。

2. 選取省略號 （...），然後選取 [ 顯示 Git 輸出]。

   

Visual Studio Code 的工具，用於操作 Git 和 GitHub

在 Visual Studio Code 中使用存儲庫需要使用不同的工具。

圖標	資訊	存取自
	命令選擇區中的 Git 命令	F1
	原始檔控制延伸模組	活動列
	GitHub 提取要求和問題 擴充功能	活動列
	GitHub 存放庫 擴充功能	您可以快速輕鬆地開啟 GitHub 存放庫，方法是從命令選擇區中搜尋“GitHub 存放庫: 開啟存放庫...”，按下 F1，或者從位於狀態列左下角的綠色按鈕處選擇“開啟 GitHub 存放庫...”。

相關資源

• 如何 部署 Web 應用程式
• 在 Visual Studio Code 中使用 GitHub
• 搭配其他版本控制提供者使用 Visual Studio Code