iOS 元件化實戰篇（私有庫）

張炫赫發表於2019-04-19
iOS元件化

前沿

本片文章主要講解我們專案中為什麼要元件化 元件化的好處 怎麼使用元件化 怎麼實現元件化

為什麼要元件化

  • 隨著專案的更新迭代 專案程式碼越來越複雜 每個模組之間相互依賴 更改一處程式碼 有可能要更改跟這段程式碼耦合度非常高的多處程式碼 導致增加了我們的開發時間 增加了不必要的麻煩
  • 使用元件化 可以把業務模組 共同的功能性程式碼和基礎程式碼 分離出來 單獨管理 每個開發人員只負責維護自己的模組就可以了 不僅節省了開發週期 還大大降低了維護成本

元件化的細想

就好比封裝控制元件，複雜的控制元件一般都會封裝，元件化只不過是把每個模組單獨抽出來，作為一個小工程，然後在組成一個一個完整的專案

元件化的實現

  • 在專案當中我們使用Cocoapod來管理我們的元件化開發
  1. 開啟終端 建立一個XXX專案工程 cd 到一個檔案跟目錄下
pod lib create xxx
複製程式碼

  1. 配置下工程資訊

    Snip20180402_7.png

  2. 工程配置完成 我們把我們需要的專案元件拖入到我們工程的Classes檔案中 然後 cd 進入到Example 檔案中 pod install 安裝下我們的元件

    Snip20180402_9.png

為什麼要pod install,因為不重新pod install Example工程根本不知道Pod更新了，pod install的作用：重新讓pod庫與所依賴的工程檔案產生關聯 開啟 Example 檔案中的專案 Command+B 一下 如果沒有問題 就說明整合成功

  1. 配置描述檔案 podspec 這裡需要重點說一下 podspec 檔案
    podspec : 描述自己元件工程的程式碼目錄和資源目錄在哪，還有自己元件工程所依賴其他框架，到時候就會根據podspec的指引去引入自己的倉庫程式碼
// 建立pod索引庫，固定寫法,並且定義索引庫的名字為s,後續通過s，就能拿到索引庫
    Pod::Spec.new do |s|
    
      // 設定名稱
      s.name         = "tcggMain"
    
      // 設定版本號
      s.version      = "0.0.1"
    
      // 設定摘要
      s.summary      = "A short description of tcggMain."
    
      // 設定詳情
      s.description  = "Good"
    
      // 設定倉庫主頁
      s.homepage     = "http://xxxx/xxxx"
    
      // 設定許可證
      s.license      = "MIT"
    
      // 設定作者
      s.author             = { "iThinkerYZ" => "xxxx@qq.com" }
    
      // 設定倉庫源,表示在哪可以找到元件工程
      s.source       = { :git => "xxxxx", :tag => "#{s.version}" }
    
      // 設定 原始檔路徑 => 不是整個工程的檔案，而是自己封裝的程式碼，以後別的工程引入，就會引入這裡的程式碼。
      s.source_files  = "tcggMain/Classes/**/*.{h,m}"
    
     // s.dependency = '' 元件工程依賴哪些第三方框架
     // s.frameworks = 'UIKit', 'MapKit' 元件工程依賴哪些原生框架
     // s.resource_bundles = {} 元件工程圖片資源
     
    end

複製程式碼

PodSpec

  1. 本地元件配置完成之後 就需要把本地的元件上傳的遠端私有倉庫（ 上傳的程式碼就不貼出來了 網上有很多 ）

注意點：push 遠端倉庫的時候 一定要打tag 並且tag的版本號要跟Spec檔案中 s.version 的版本號一致 因為cocoapods是根據程式碼倉庫的tag,去下載對應tag的遠端程式碼庫的

6.在本地Cocoapods索引庫中建立我們私有元件的索引庫檔案

pod repo add 私有元件名稱 索引庫遠端地址
pod repo add TcggBase https://git.coding.net/XUser/TccBase.git
複製程式碼

如果不想使用命令列輸入的話 我們也可以手動建立 -- 找到本地的cocoapods 的地址 在 repos 檔案中建立一個 TcggBase 檔案

Snip20180402_14.png

  1. 把自己私有庫的索引新增到自己私有庫中
pod repo push 索引庫名稱 當前元件中podspec檔案全稱
pod repo push TcggBase TcggBase.podspec --allow-warnings
複製程式碼

本地索引庫就會有自己的私有庫，並且遠端也會有，pod repo push 會幫我們推送到遠端索引庫

Snip20180402_15.png

開啟本地cocoapods中自己的私有庫索引地址 發現裡面已經有了 我們自己的私有庫索引 0.1.0 是我們的版本號 cocoapod 會根據Spec檔案中的tag 建立相對應的檔名稱

如果 Push 中出現的錯誤 我們也可以手動去上傳 在cocoapods 本地索引庫中 找到我們自己建立的索引庫 在我們自己建立的索引庫中 我們手動建立我們跟當前Spec檔案中 描述的版本號相符的檔案 檔名字就是我們當前元件的版本號 在把我們自己元件中的Spec檔案複製 拷貝到當前的檔案中去 就行了

######使用自己的私有索引倉庫 在 Podfile 檔案中 新增兩個 source 一個是cocoapods 公有的索引庫源 一個是我們自己的索引庫源 然後我們在pod 'xxx' pod install 就可以了

Snip20180402_17.png

元件化升級

  • 只需要把最新的版本程式碼繫結tag,更新Podspec檔案，重新上傳到版本索引庫就好了
pod repo push xxxx xxxx.podspec --allow-warnings 
複製程式碼
  • 工程檔案在使用的時候，使用pod update 就能載入最新版本元件程式碼.
pod update --no-repo-update
複製程式碼

Cocopods原理

1.根據Podfile描述，找到對應程式碼庫的描述檔案podspec 2.podspec中描述，去哪（s.source）才能找到程式碼庫，並且找到之後，需要拷貝哪些檔案（s.source_files）到自己的工程中。

元件化中遇到的一些問題

載入XIB檔案報錯

02576880-5A64-4125-AD02-2D6639931103.png

回到程式碼檢視一下，原來載入XIB的方式如下

BC46FF90-7496-4DB7-86D0-BD080AF2AB9C.png
顯然通過載入上面的bundle的方式載入不到XIB，需要重新設定budle的路徑，修改如下：
55D1EFCD-B138-4AF9-B5BB-DD8F7878BFB1.png

圖片資源載入問題

把元件中需要的圖片存放到Assets中

4A887AAA-B538-464B-A71E-5E6E8DBAD536.png

需要修改.podspec檔案，開啟資源的載入路徑，然後執行pod install。然後會發現多了一個Resource的資原始檔夾

FD4D7ECF-48C2-47BE-BBF6-9C708C6B0B70.png

需要改變圖片的載入方式

94BC756A-0218-4662-BB14-5FEC4FC9E532.png

說明：必須指明圖片的全名和圖片所在bundle的包名 因為涉及到@2x，@3x圖片這裡不能寫成固定的，應該按照scale來設定

02A9C836-51EF-4CC4-A26D-F346904B8717.png

因為之前設定圖片的方式都需要修改，上面修改圖片載入方式的程式碼在很多地方都會用到，所以最好的做法就是抽取一個工具方法

+ (instancetype)ff_imagePathWithName:(NSString *)imageName bundle:(NSString *)bundle targetClass:(Class)targetClass
{
        NSInteger scale = [[UIScreen mainScreen] scale];
        NSBundle *currentBundle = [NSBundle bundleForClass:targetClass];
        NSString *name = [NSString stringWithFormat:@"%@@%zdx",imageName,scale];
        NSString *dir = [NSString stringWithFormat:@"%@.bundle",bundle];
        NSString *path = [currentBundle pathForResource:name ofType:@"png" inDirectory:dir];
        return path ? [UIImage imageWithContentsOfFile:path] : nil;
}
複製程式碼

修改字型

將字型相關檔案也拖入到Assets資料夾下，然後修改一下podspec檔案。最後執行pod install把字型資源pod進來。 接著在原來設定字型的地方做相應的修改，和修改圖片資源路徑的方式相似

   _categoryLabel = [[UILabel alloc]init];
    NSBundle *currentBundle = [NSBundle bundleForClass:[self class]];
    NSString *path = [currentBundle pathForResource:@"CODE BOLD.OTF" ofType:nil inDirectory:@"FFSpecialKit”];
    [_categoryLabel text:nil textColor:kHexColor_c7a762 fontSize:FONT_SIZE_14 fontName:path];
複製程式碼
下一篇

元件化之間的通訊

相關文章