利用Git subtree 部署專案到 GitHub

Git subtree 教程

---

關於子倉庫或者說是倉庫共用，git官方推薦的工具是git subtree。 我自己也用了一段時間的git subtree，感覺比git submodule好用，但是也有一缺點，在可接受的範圍內。所以對於倉庫共用，在git subtree 與 git submodule之中選擇的話，我推薦git subtree。

Git subtree是什麼？為什麼使用Git subtree

---

git subtree 可以實現一個倉庫作為其他倉庫的子倉庫。

使用git subtree 有以下幾個原因：

• 舊版本的git也支援(最老版本可以到 v1.5.2).
• git subtree與git submodule不同，它不增加任何像.gitmodule這樣的新的後設資料檔案.
• git subtree對於專案中的其他成員透明，意味著可以不知道git subtree的存在. 當然，git subtree也有它的缺點，但是這些缺點還在可以接受的範圍內：
• 必須學習新的指令(如：git subtree).
• 子倉庫的更新與推送指令相對複雜。

Git subtree 的使用

---

git subtree的主要命令有：

 git subtree add   --prefix=<prefix> <commit>
 git subtree add   --prefix=<prefix> <repository> <ref>
 git subtree pull  --prefix=<prefix> <repository> <ref>
 git subtree push  --prefix=<prefix> <repository> <ref>
 git subtree merge --prefix=<prefix> <commit>
 git subtree split --prefix=<prefix> [OPTIONS] [<commit>]
複製程式碼

準備

---

我們先在Github 中建立vue-login，然後按照 GitHub 上的提示將專案克隆到本地

     git clone https://github.com/surile/vue-login.git
複製程式碼

vue-login的路徑為https://github.com/surile/vue-login.git，倉庫裡的檔案有：

     vue-login
     |
     |-- build
     |-- pulish
     |-- src
     |-- webpack.common.js
     |-- webpack.prod.js
     |-- webpack.dev.js
     \-- README.md
複製程式碼

以下操作均位於根目錄中。 我們執行以下命令把master 分支中的 build 檔案推送到遠端倉庫gh-pages分支中：

    yarn build || npm run build
    git checkout -b gh-pages
    git add -f build
    git commit -m 'created gh-pages'
    git subtree push --prefix build origin gh-pages
複製程式碼

這步做完之後就可以在 GitHub 上看見 gh-pages 分支了。GitHub 會自動部署 gh-pages 裡的靜態檔案。 點開 Settings，將會看到以下內容。勾出綠色部分則是你的URL

當我們修改專案完成之後，肯定是要從前 build 的。這時使用以下命令，則就沒用了。

     yarn build || npm run build
     git add -f build
     git commit -m '重新 build'
     git subtree push --prefix build origin gh-pages
複製程式碼

會出現以下錯誤。

出現這種錯誤，根據提示我們可以看出來，是要讓我們強行將 build 推送到遠端gh-pages 分支上，則可以用以下命令

     git push origin `git subtree split --prefix build master`:gh-pages --force
複製程式碼

執行命令，則可以強制將 build 資料夾推送到遠端 gh-pages 分支上了。