在 WebStorm 中熟練地使用 git
原文連結:在 WebStorm 中熟練地使用 git
WebStorm 是一款非常強大的程式碼編輯器,然而其中一些技巧有待我們深入發掘,在這裡我先寫一篇 git 操作相關的使用技巧,希望能夠向大家介紹,如何在 WebStorm 中熟練地使用 git?
下面我們將以圖形化介面的方式,教會大家:
1。 git init 初始化(這一步要在命令列操作)
2。 git remotes 管理(增刪改查)
3。 git clone 檢出(約等於以上兩步的合成)
4。 git fetch 拉取遠端倉庫更新
5。 git merge 合併分支
6。 git merge 解決衝突
7。 git add 追蹤檔案
8。 git commit 提交檔案
9。 git push 推送檔案
前置準備:這裡我們以 coding。net 這個程式碼託管網站中演示:
- 我們先來建立一個倉庫
- 建立成功,複製遠端倉庫地址
https://
git。coding。net/dear_liz
hihua/repository-demo。git
那麼,如何將專案同步到本地呢?這裡我們提供兩種方式:
- 第一種思路是,建立一個全新專案後,對其
git init
初始化為 git 專案,然後設定遠端倉庫地址
- 第二種思路是,直接
check out
檢出 github 倉庫到本地目錄
方式一
在 WebStorm 中,建立一個專案:
在專案根目錄下,執行如下 git 命令:
git init
如果此時看到 WebStorm 中出現
Version Control
工具條,並且專案目錄下出現
。git
資料夾,說明我們的專案已經成功初始化為 git 專案
這時我們還需要設定遠端倉庫地址
這裡透過圖形化介面,對 remotes 進行查詢、新增、修改、刪除,而且可以設定多個 remote,相當直觀 ^_^
成功新增遠端倉庫地址
其實,對應的 git 命令是
// 新增
git remote add origin https://git。coding。net/dear_lizhihua/repository-demo。git
// 刪除
git remote remove origin
// 修改 = 刪除 + 新增
git remote remove origin
git remote add origin https://git。coding。net/dear_lizhihua/repository-demo。git
// 查詢
git remote -v
方式二
注意,在資料夾下檢出時,不能有同名的檔案目錄存在
其實,對應的 git 命令是
git clone https://git。coding。net/dear_lizhihua/repository-demo。git
拉取遠端倉庫更新
這裡,我們將大家熟悉的 git pull,拆分為大家不熟悉的
git fetch
和
git merge
兩個命令的合成,其實拆分後的操作,是比較安全穩妥的做法,具體原因我會在下面詳細解釋(還可以參考 git 少用 pull 多用 fetch 和 merge(git: fetch and merge, don’t pull) 一文),建議大家儘量透過這種方式
更新遠端倉庫的所有分支
這裡我們解釋下為什麼不使用 git pull 這種奇怪操作的原因:
1。 使用 git pull,會在更新完直接 merge。而在兩個分支之間有多個檔案衝突的情況下,會導致產生一堆待 merge 檔案。
2。 只使用 git fetch 更新遠端倉庫的所有分支,等於將這種衝突放在 git merge 這一步。這樣我就可以等到真正需要的時候,再去解決分支下檔案的衝突
前置準備:這裡我們的遠端倉庫還是一個空的倉庫,為了演示我們需要先在網站頁面進行檔案操作,以進行更新操作
前置準備開始
勾選
啟用 README。md 檔案初始化倉庫
,點選
快速初始化倉庫
按鈕
成功建立 README。md
前置準備結束
先記住右下角的工具條中的分支
然後,我們進行更新
奇怪?遠端的分支已經出現了,但是檔案並沒有更新,版本控制裡面也沒有任何提交記錄
以下這些步驟,只在專案初始化時用到
在第一次更新時,我們還需要將 checkout 到 origin/master 上,然後建立從 origin/master 分支處建立 master 分支
至此,更新就算成功了
將遠端分支,合併到本地分支
前置準備:這裡為了演示,我們需要先在網站頁面中執行遠端分支更新
前置準備開始
點選新建檔案,建立一個 。gitignore 檔案
前置準備結束
然後,我們執行上一步的 git fetch
更新成功後,執行 merge 操作
merge 完成,成功獲取到遠端倉庫的檔案
其實,對應的 git 命令是
git fetch origin
git merge origin/master
解決衝突 & 衝突時的說明
前置準備:這裡我們以 http://webpack.js.org 中文倉庫為例,translation 分支是英文文件分支,cn 分支是中文文件分支,二者都是從 master 分支中建立。
衝突產生的說明:我們首先應當瞭解,git 是基於檔案差異、逐行對比。我們一般會在 cn 分支下進行翻譯,然而有時我們會遇到這樣一種情況,當 translation 分支和 cn 分支都對同一檔案的相同行做了修改(這種場景非常常見,因為 translation 分支,同一檔案很可能會增刪改某一句、符號,而我們對這一句也做了翻譯),此時將兩個分支合併,就會發生行的衝突,這時就需要我們解決衝突。我們用以下一系列圖片說明:
將 Local Branches 中的
translation 分支
合併到
cn 分支
。
衝突檔案的列表
開啟第一個檔案,找到衝突的行(紅色背景)
重要說明:中間部分是 未衝突時 cn 分支下,此檔案所在的 git 節點;左側是 cn 分支下,從 未衝突的 git 節點 到 此檔案最新的 git 節點
的所有 commit 改動;右側是 en 分支下,從
未衝突的 git 節點
到
此檔案最新的 git 節點
** 的所有 commit 改動。
重新翻譯,將這行的兩側合併(紅色背景自動消除)
右側綠色背景的是 translation 分支新增的行,左側藍色背景是 cn 分支修改的行,我們透過 accept 將這些行整體合併過來(綠色背景和藍色背景自動消除)。
所有的新增、修改、刪除全部處理後,出現提示
第一個檔案從列表中消失,接下來我們逐個合併這些檔案
也可以透過
accept yours
和
accept theirs
批次處理合併
出現一個新的 git 節點
試著 push 一下,會發現提交記錄為
Merge branch ‘translation’ into cn
的最後一個 git 節點,就是我們合併處理過的那些檔案,這裡我們暫時不推送到遠端倉庫的分支,選擇 Cancel
如果 merge 過程出現問題,不要過分擔心,因為我們並沒有產生真正推送,遠端倉庫的分支下暫時還沒有我們的提交記錄,我們先 git reset 重置到 origin/cn 分支的最後一個 git 節點上
選擇 Hard 模式
其實,對應的 git 命令是(其中
{{git_node_hash}}
部分是你希望重置的 git 節點 hash)
git reset ——hard {{git_node_hash}}
重置成功了,我們可以將上面的合併步驟再重複一次
追蹤(add)本地目錄中的檔案
前置準備:這裡我們為了便於演示,先建立一個新檔案 LICENCE
這個檔案未被追蹤時,是紅色文字,我們點選 add 追蹤它
其實,對應的 git 命令是(其中
{{git_node_hash}}
部分是你希望重置的 git 節點 hash)
git add LICENCE
將本地目錄提交(commit)到遠端倉庫
追蹤成功後,點選 commit 提交它
填寫 message 提交資訊 add LICENSE,然後點選
Commit
按鈕
提交成功
其實,對應的 git 命令是
git commit -m ‘add LICENSE’
將本地目錄推送(push)到遠端倉庫
點選
Push
選擇分支
Current Branch
push 的資訊詳細,點選
Push
按鈕
pushing。。。
push 成功
其實,對應的 git 命令是
git push origin master