git subtree：無縫管理通用子項目

移動互聯網的爆發以及響應式頁面的尷尬症，開發web和mobile項目成爲了標配，固然實際狀況下，會有更多的項目。

多項目開發對於前端來講是個很大的挑戰
✦ 重複，重複的前端架構，重複的前端依賴，重複的工具函數等
✦ 侷限，不一樣後臺有不一樣的規則，「因地制宜」真難受，剛伺候好rails又忽然來個php
✦ 最優，後臺工程作前端構建，老是顯得不夠「最優」。

因此，咱們須要單獨抽離出前端開發項目，按照前端的方式來組織代碼，經過構建工具來對前端資源文件作最優處理
那麼新問題來了，如何管理這個快速迭代，頻繁更新的前端項目呢？
✦ 做爲單獨的項目管理？
✦ 用git submodule or git subtree管理？

多個後臺項目：qdaily4_web/moible/app
前端項目：qdaily4_feboierplate

以前的開發模式

✦ 在qdaily4_feboierplate項目中修改前端代碼
✦ 構建qdaily4_feboierplate項目，輸出到qdaily4_web/mobile/app
✦ 提交qdaily4_feboierplate項目的改動
✦ 在qdaily4_web/mobile/app項目中修改後臺代碼
✦ 提交qdaily4_web/mobile/app項目的改動，其中包括qdaily4_feboierplate項目構建輸出的文件

這種開發模式解耦了前端項目和後臺項目，前端項目嚴格按照前端的代碼結構去組織代碼，可以實現模塊化，按需加載，就近原則，圖片壓縮等功能。缺陷在於須要頻繁的切換項目提交代碼。

爲了解決頻繁切換項目的問題，調研了git submodule和git subtree以後，選擇用git subtree來解決這個問題。

如今的開發模式

qdaily4_feboierplate做爲qdaily4_web/mobile/app的子項目，別名appfe
✦ 在appfe項目中修改前端代碼
✦ 構建appfe項目，輸出到qdaily4_web/mobile/app
✦ 提交qdaily4_web/mobile/app項目的改動（也會記錄appfe項目的改動）
✦ 使用git subtree命令提交appfe的改動到qdaily4_feboierplate

引入git subtree以後，再也不感受是在開發兩個項目，不須要頻繁的切換項目提交代碼，只須要使用git subtree命令就能夠實現qdaily4_feboierplate項目的雙向更新，快速開發。缺陷在於存在多個qdaily4_feboierplate項目的拷貝。

雙向更新

前端項目qdaily4_feboierplate是做爲子git被包含到多個後臺項目中，咱們經過git subtree pull & git subtree push實現qdaily4_feboierplate的雙向更新，對於不穩定且須要快速迭代的模塊代碼恰到好處。

利用git subtree來管理前端模塊項目和多個後臺環境項目，能夠有效快捷的實現前端模塊項目快速開發，雙向更新，配合上前端構建系統，簡直爽翻了。

小技巧

git倉庫取別名

使用appfe做爲git@bitbucket.org:qdaily/qdaily4_feboierplate倉庫的別名
✦ 直接命令行輸入：

git remote add appfe git@bitbucket.org:qdaily/qdaily4_feboierplate.git

✦ 也能夠經過配置.git/config文件：

[remote "appfe"] url = git@bitbucket.org:qdaily/qdaily4_feboierplate fetch = +refs/heads/*:refs/remotes/appfe/*

git指令自定義

git subtree pull 和 git subtree push 是須要頻繁使用的命令，咱們能夠經過自定義來讓git指令更簡單更好記

✦ 直接命令行輸入

git subtree pull --prefix=appfe appfe master git subtree push --prefix=appfe appfe master

✦ 也能夠配置.git/config讓git subtree的命令更簡單
!：表示外部命令而不是git命令，至關於直接在shell中運行!後的組合命令。
$1：表示shell傳進來的第一個參數，好比git stpull demo/xxx，那麼$1就是demo/xxx。
:：組合命令尾部的:很神奇，沒有它，最後一個指令不會運行，因此它起到一個佔位的做用。
第二版Tip：
✦ 能夠看出，若是當前分支沒有stash的東西，這個組合命令會出現問題，還未想到解決方案，有了解的人能夠留言指出。

// 第二版
// git stpull demo/xxx // git stpush demo/xxx [alias] stpull = !git stash \ && git subtree pull --prefix=appfe appfe $1 \ && git stash pop \ && : stpush = !git stash \ && git subtree push --prefix=appfe appfe $1 \ && git stash pop \ && :

第三版Tip：
✦ 放棄了stash，讓用戶本身去處理stash相關的事情。
✦ 使用兩個參數，表示子項目目錄和分值名稱，這樣能夠兼容處理多個子項目，不一樣分支的狀況。
✦ 使用git subtree split --rejoin，解決了每次提交都須要重頭遍歷commits耗時過長的問題。
✦ 每次git subtree push以前都先git subtree pull，是爲了解決錯誤時機git subtree split致使push失敗。
✦ 初次運行時，遠端沒有demo/xxx分支，須要使用git subtree push -P appfe demo/xxx新建遠端分支。

// 第三版 // git stpull appfe demo/xxx // git stpush appfe demo/xxx [alias] stpull = !git subtree pull --prefix=$1 appfe $2 \ && : stpush = !git subtree pull --prefix=$1 appfe $2 \ && git subtree split --rejoin --prefix=$1 $2 \ && git subtree push --prefix=$1 appfe $2 \ && :

自定義git指令對於一些常使用的長命令頗有效，強烈建議使用！

學習過程當中遇到什麼問題或者想獲取學習資源的話，歡迎加入學習交流羣343599877，咱們一塊兒學前端！