如何在大型項目中使用Git子模塊開發

寫在前面

公司須要開發一個內部系統，要求每一個部門都要接入。老闆欽點，工期又壓得短，因而浩浩湯湯的上百人就調過來了。

再簡單的事情，只要人多起來就會變得複雜，開發的世界也是如此。

---

痛點

一個幾百人的大項目，使用Git協做的時候，想想咱們的痛點：

1. 項目過大，每一個人clone等待時間過長
2. 一會沒有拉取代碼就會發現有上百條更新待拉取
3. 一人提交出錯，上百人待機（筆者真實體驗）
4. 代碼回溯困難，查找具體的修改記錄無異於大海撈針

解決方案

這時候Git子模塊就派上用場。

首先須要的固然是一個合理的架構，因爲公司的保密原則這裏就不貼項目了，本文主要描述在協做中子模塊的用法。

項目結構

項目主體結構大概是這樣的：

└── src
    ├── layout // 公共佈局目錄
    ├── public // 公共頁面目錄
    ├── router // 路由入口
    ├── components // 通用組件
    ├── modules    // 模塊項目開發目錄（子模塊）
    |    ├── tms    // 子模塊必須
    |    │    ├── components // 模塊通用組件
    |    │    ├── pages // 模塊頁面
    |    │    ├── router // 模塊路由
    |    │    └── store // 模塊vuex數據
    |    └── ... // 各子模塊
    ├── app.vue   // 跟組件
    └──  main.js   // 項目入口
複製代碼

一個部門一個子模塊，每一個子模塊必須包含master（生產）、dev（開發）分支（推薦 gitflow 工做流）。

開發流程

克隆項目

如全部的webpack項目同樣，src只是業務代碼，開發配置都放在src外層，因此跑起開發環境首先須要克隆主項目。

$ git clone https://github.com/test/main.git
複製代碼

添加子模塊

固然咱們通常不用master分支作開發，正確的姿式是clone項目以後立刻切換到基於dev的開發分支（原則上業務組不須要關注主項目的開發，主項目由架構組負責，可是爲了保證代碼的最新，而且將子模塊添加合併進dev分支中，因此切換到主分支dev）。

$ git checkout -b dev origin/dev
複製代碼

這時候若是你的項目中已經有子模塊了，你會發現modules文件夾下已經有了一個個子模塊，可是顯然如今這些模塊都是空目錄（預期的結果，咱們不須要關注其餘模塊）。同時項目根目錄下有一個.gitmodules文件，內容以下：

[submodule "modules/suba"]
	path = modules/suba
	url = https://github.com/test/suba.git
複製代碼

這裏就是你的子模塊關聯文件，每添加一個子模塊就會新增一條記錄，若是是第一次添加Git子模塊會自動生成。

開發環境有了，如今須要關聯你的子模塊：

$ git submodule add https://github.com/test/subb.git modules/subb
複製代碼

首次添加的子模塊會拉取整個項目，打開muodules/subb文件夾，整個子模塊項目都無缺地列在那裏，同時.gitmodules裏新增了一條子模塊記錄modules/subb。

編輯子模塊

一樣的，咱們也不該該在子模塊的master分支上作任何編輯，這時候咱們須要將子模塊切換到基於dev的開發分支。

進入子模塊目錄下：

$ cd modules/subb/
$ git checkout -b feature/some-change origin/dev
複製代碼

當你在子模塊作完一些修改一些修改以後，你想要把這這些修改推送到遠程。

$ git commit -am 'test commit submodule'
$ git checkout dev
$ git merge feature/some-change
$ git push origin dev
$ git branch -d feature/some-change
複製代碼

這時候你的子模塊的修改就已經提交到遠程了，可是若是你進如到主項目的根目錄查看差別，你會發現主項目中多了一些修改：

$ cd ../../
$ git diff
>   diff --git a/subb b/subb
    index 433859c..b78179a 160000
    --- a/subb
    +++ b/subb
    @@ -1 +1 @@
    -Subproject commit 433859c90e539d2a1b9fda27b32bef0d0acae9e6
    +Subproject commit b78179adab252a524ff2a41d6407a7daa6dad34f
複製代碼

這是由於你修改了子模塊subb並提交了，可是主項目的指針依舊指向那個老的commit id，若是你不提交這個修改的話，別人拉取主項目而且使用git submodule update更新子模塊仍是會拉取到你修改前的代碼。

因此這時候你須要把主項目也提交一遍：

$ git commit -am "test commit submodule"
$ git push origin dev
複製代碼

這樣，你的修改就已經所有提交了。

新成員加入

當有新成員你加入你的子模塊而且須要拉取代碼的時候：

$ git clone https://github.com/test/main.git
$ git checkout -b dev origin/dev
$ git submodule init
$ git submodule update subb
複製代碼

git submodule update [submodule name]是指定拉取指定子模塊的用法，若是你須要更新全部的子模塊只須要使用git submodule update就能夠了，通常咱們在協做中只關注本身的模塊。

那麼接下來新成員也能夠延續咱們上面的開發流程了。

刪除子模塊

固然也有需求變更或者添加錯誤的時候，這時候就須要刪除子模塊了，值得吐槽的是git沒有直接刪除子模塊的命令，因此只能逐步刪除相關文件：

• 在版本控制中刪除子模塊：

$ git rm -r modules/subb
複製代碼

• 在編輯器中刪除以下相關內容，也可使用命令vi .gitmodules在vim中刪除：

[submodule "modules/subb"]
          path = modules/subb
          url = https://github.com/test/subb.git
          branch = dev
複製代碼

• 在編輯器中刪除以下相關內容，也可使用命令vi .git/config在vim中刪除：

[submodule "modules/subb"]
         url = https://github.com/test/subb.git
         active = true
複製代碼

• 刪除.git下的緩存模塊：

$ rm -rf .git/modules/subb
複製代碼

接下來提交修改：

$ git commit -am "delete subb"
$ git push origin dev
複製代碼

發佈項目

當整個開發流程都結束了，終於到了發佈的時刻，固然須要在主項目更新你的全部子模塊：

$ git checkout master
$ git pull origin master
$ git submodule update
$ yarn build
複製代碼

這時候就能夠發佈你整個項目了 😊，關於協做中使用子模塊的操做就寫到這裏，若是有疑問請在評論區留言。

-- The End