上一篇文章:Git 1/4: 甚麼是 Git/Github?為什麼需要專案版本管理?
上一篇我們介紹了 Git 與版本管理(version control)的基本概念,以及其希望解決的問題後,我們一起來看看如何在 VS Code 的專案裡啟用 Git 的功能吧!
我們在這篇教學裡會使用 VS Code 作為我們 Python 編程工具。如果您不太熟悉 VS Code 的工作環境,或未有在您的電腦安裝 VS Code,可以按這裡:
- VSCode 1/5: macOS 最佳 Python 編程工具?豐富的插件商店?Visual Studio Code 安裝攻略
- VSCode 2/5: 設定虛擬環境 Virtual Env,管理 Python 專案!
- VSCode 3/5: 實戰篇!版面介紹、管理 Python 專案和多個 .py
- VSCode 4/5: 讓 pip 安裝和管理 Python Libraries,結合虛擬環境!
- VSCode 5/5: Jupyter Notebook 互動編程?實在太方便了
- Git 1/4: 甚麼是 Git/Github?為什麼需要專案版本管理?
第 1 步:安裝 VS Code 的 Git 插件
首先我們到 VS Code 的插件商店安裝「Git Extension Pack」。如果您不知道 VS Code 強大的插件商店,可以參考這篇教學:VSCode 1/5: macOS 最佳 Python 編程工具?豐富的插件商店?Visual Studio Code 安裝攻略
VS Code 裡有許多的 Extension Pack 讓我們選擇。就像一個福袋,Extension Pack 讓我們可以一鍵安裝多個的 Extension,簡化我們選擇不同 Extension 的時間。
安裝完成後,您可能會見到這個彈出視窗,要求您在 macOS 安裝 Git。這是由於 macOS 內置本來未有安裝 Git 的軟體,所以如果我們需要在 VS Code 使用 Git 的話,便需要 macOS 為我們先安裝 Git。
順帶一提,如果您手快,未有在彈出的視窗按「Install」,可以在 Terminal 運行以下指令,使 macOS 再次彈出安裝 Git 的請求:
git --version
第 2 步:在 VS Code 專案啟用 Git
Git 的安裝完成後,我們回到 VS Code 的主頁面。這裡我們建立了一個新的專案名叫「gitproject」,如果您不知道如何建立新的 VS Code 專案可以按這裡:VSCode 3/5: 實戰篇!版面介紹、管理 Python 專案和多個 .py
如果您已經有一個現有的專案,您也可以直接使用現有的專案跟隨以下教學。
在 VS Code 的左邊,我們按一下「Git」的圖案,並且按一下「Initialize Repository」。
完成後,您的「Source Control」版面應該有以下的選項:
如果您有興趣,可以到您的 VS Code 專案裡顯示隱藏的檔案(macOS 的快捷鍵是 Command + Shift + .)。您會發現您的專案多出了一個「.git」的文件夾。
這個「.git」的文件夾就是用來儲存檔案的不同版本。值得一提的是,git 通常儲存的是 2 個版本的分別(diff),所以您不會在這裡見到一個完整的備份。
第 3 步:設定 Git 的用戶名與電郵
接下來我們設定在 Git 的用戶名以及電郵地址。
在 git 的操作裡,我們需要一個「用戶」為這些操作背書。例如我們加入修改(commit)時,便需要標籤一個用戶(例如自己),從而使整個過程可追溯。
Git 的「用戶」最低需求是一個名稱(user.name)和電郵地址(user.email)。
我們開啟一個新的 Terminal 視窗(在 VS Code 裡按 Command + Shift + P,然後選擇「Python: Create Terminal」),並按序輸入以下 2 行:
git config --global user.email "<您的常用電郵地址>" git config --global user.name "<您的暱稱>"
這個用戶設定會適用在在您的 macOS 帳戶。即使您開啟其他 VS Code 的專案,甚至使用其他的編程軟件(IDE),也不用重新設定。
第 4 步:建立新的檔案
如此以來,我們可以開始建立新的檔案,測試一下 Git 的基本功能了!
首先我們回到專案首頁,並建立一個新的檔案,名叫「main.py」。如果您不知道如何建立一個新的檔案,可以按這裡:VSCode 3/5: 實戰篇!版面介紹、管理 Python 專案和多個 .py
留意我們的新檔案變成了綠色,而在 Explorer 的右側出現了「U」的字眼。「U」的全寫是 Untracked,意思就是這一個檔案未在任何的 Git 分支(branch)裡有紀錄。
所以,我們可以透過看看檔案是否標記為綠色而斷定這是否一個新的檔案。
接下來我們到左邊的「Git」圖案,跳到「Source Control」的版面。留意在「Changes」框框裡多了「main.py」。這個「Changes」的框框十分重要,因為它會告訴我們有哪些檔案被修改了,包括新建的檔案。
此外,我們也能看到「File History」框框裡多出了一行「Uncommitted changes」。這個框框有助我們了解這個檔案的改變過程。由於我們的「main.py」檔案是新建的,所以在 File History 裡只有未在任何 Git 分支的紀錄。
第 5 步:加入新的修改(commit)
接下來,我們在 main.py 裡輸入以下的簡單代碼,並且按一下「Command + S」儲存檔案。
print("Hello World")
留意我們的檔案仍然是處於綠色(Untracked)的狀態。還記得我們上一篇教學有關修改(commit)與分支(branch)的概念嗎?現在,我們是時候把 main.py 的內容在 Git 裡加入為新的修改(commit)了。
我們先來勾劃一下加入新的修改(commit)的步驟:
- 儲存已更改的檔案
- 把需要加入修改(commit)的檔案加入「Staged Changes」
- 輸入修改信息(commit message)並在分支(branch)加入修改(commit)
把檔案加入 Staged Changes
首先我們需要在 Changes 的框框下,選擇 main.py 並按一下「Stage Changes」的按鈕。
「Stage Changes」 讓我們能夠選擇略過某些已經更改的檔案。比方說,我們現在更改了 2 個現存的檔案,加入了 1 個新的檔案,那麼 Changes 的框框了會有 3 個檔案。但如果我們還沒有完善新加入的檔案,只希望把 2 個現存的檔案加入修改(commit),那麼我們便可以只把 2 個檔案「Stage Changes」,從而略過新加入、未完成的檔案。
完成後,我們會見到在 Changes 框框了,多出了「Staged Changes」一欄,而 main.py 將會在 Staged Changes 以下。
此外,我們亦能見到在 File History 的框框裡,我們從本來的「Uncommitted changes」變成了「Staged Changes」。這是代表我們已經把 main.py 裡的更改提升至「Staged」的環節。
留意我們的檔案現在是綠色的「Added」狀態,代表我們已經將新的檔案加入了 Staged Changes 和 Git 的視線範圍。
把 Staged Changes 加入修改(commit)和分支(branch)
我們現在已經準備好把 Staged Changes 加入分支(branch)了!
在右上方「Message (Command Enter to commit on ‘master’)」的框框裡,我們應該輸入一些有關這個修改(commit)有用的訊息。例如我們加入了「main.py」,可以填寫「Create new file」。
填寫了 Commit Message 後,我們按一下「Command + Enter」,便成功把我們的 Staged Changes 變成一個修改(commit),加入了 master 這個分支(branch)了!
完成後,我們可以見到以下的改變:
- Changes/Staged Changes 的框框現在是空白的,代表我們已經把所有檔案加入分支(branch)的修改(commit)
- Commits 的框框從「No commits could be found」多出了「Create new file」的修改(commit)。這是顯示我們現在使用的分支(即 master 分支)有了 1 個新的修改,就是我們剛剛加入的修改。如果我們放大(expand)這個項目,會見到 main.py 的更改
- File History 的框框多出了「Create new file」一行。由於 File History 會顯示我們現在開啟的檔案(即 main.py)以往有什麼修改,所以它告訴我們,在「Create new file」的修改了我們曾經更改了 main.py
- Branches 的框框裡,master 分支多出了一個「Create new file」的修改(commit),跟 Commits 框框的資訊一樣。
順帶一提,如果您在以上的步驟裡得到了以下這個彈出視窗,這是因為您還沒完成我們教學第 3 步有關設定 Git 用戶名和電郵的步驟。記得先使用第 3 步介紹的方法設定好 Git,再重新試一遍修改(commit)。
第 6 步:更改已有的檔案及提交修改
現在我們試一下如果我們修改現有的檔案(existing file),會發生什麼事。
首先我們把 main.py 修改成以下的代碼,然後按一下「Command + S」儲存檔案:
print("Hello World, Samson") print("Welcome!")
留意我們的檔案現在是處於黃色「Modified」的狀態。這是由於我們在 Git 的上一個修改(commit)已經加入了 main.py,所以 Git 知道這個檔案的存在。
另外,如果我們細心留意,在 main.py 視窗的行數(line number)旁變成了藍色間條。如果您按一下藍色間條,您會見到一個彈出寫著「main.py (1 of 1 change)」。
這個彈出告訴我們 main.py 距離上一個修改(即是 Create new file)有什麼分別。我們可以見到:
- 紅色的部分有我們第一個版本時的
print("Hello World")
。這代表我們上一個版本的內容 - 黃色的部分有我們新增的內容,特別是第 1 行的
Samson
以及整個第 3 行。這代表我們現在對檔案做出了什麼更改
為現有檔案的更改加入修改(Commit)
整個流程其實跟上面新加入 main.py 的時候的流程一樣:
- 儲存已更改的檔案
- 把需要加入修改(commit)的檔案加入「Staged Changes」
- 輸入修改信息(commit message)並在分支(branch)加入修改(commit)
就如上面一樣,我們先把 main.py 加入 Staged Changes,然後輸入一個有用的修改訊息(commit message),並按一下 Command + Enter:
完成後,您會發現在 Commits 和 File History 的框框裡多出了「Add Samson」的一個修改(Commit),而「main.py」不再顯示為黃色的「Modified」狀態。
第 7 步:還原(rollback)檔案及移除修改(commit)
有時候我們為檔案加入了新的修改(commit),但我們發現還是原來的版本比較好的時候,我們該怎麼辦?
不用怕,Git 的存在就是為了這些情況!
以下我們先列出還原檔案的步驟。這些步驟就像是以上加入修改的反轉:
- 在分支(branch)選擇修改(commit),並進行修改還原(Undo Commit)
- 把變更從「Staged Changes」駁回至「Changes」
- 在「Changes」裡放棄變更(Discard changes)
如果我們在 Commits 的框框裡用滑鼠浮動在「Add Samson」的修改(commit)上, 我們會見到有個像是還原的「Undo Commit」按鈕。
按了一下修改還原(Undo Commit)後,您應該會見到如下圖一樣,我們的變更回到了「Staged Changes」的階段。
這時候,其實就跟我們先前「Stage Changes」後,還未輸入修改訊息(Commit message)一樣。
留意現在我們的 main.py 已經變回黃色的「Modified」狀態。
我們把滑鼠浮動在「Staged Changes」的 main.py 上,會發現一個像減號的按鈕,讓我們可以「Unstage Changes」,即把這些變更駁回到「Unstaged Changes」的列表裡。
按了「Unstage changes」以後,我們可以見到如下圖一樣,main.py 的變更來到了「Changes」的列表。此外,我們又看到我們熟悉的,在行數(line number)右邊的藍色間條。
如果我們把滑鼠浮動在「Changes」的 main.py 上, 會發現又一個還原的標誌。這次,它的描述是「Discard Changes」,即是把這些變更放棄的意思。
按了一下「Discard Changes」以後,您會見到一個彈出視窗,詢問您是否真的要放棄這些變更。這是 VS Code 給我們的最後警告,過了這次以後,我們便再不能恢復這些變更。
按一下藍色的「Discard Changes」按鈕繼續:
完成後,我們再也見不到 print("Hello World, Samson")
和 print("Welcome!")
。取而代之的是我們起初第 1 次修訂的版本,只有 print("Hello World")
的版本。
這也是為什麼完成了以上步驟後,我們的專案已經成功還原至較早前,我們想要它在的狀態。
結語
繼上一篇我們介紹了 Git 的基本概念後,這次我們示範了在 VS Code 裡如何應用這些的基本 Git 概念,並且成功把 main.py 以不同的 Git 修改(commit)形成不同的版本。
下一篇,我們會介紹一下 gitignore 和它的重要性,記得留意我們的文章了!