前沿
本片文章主要講解我們專案中為什麼要元件化 元件化的好處 怎麼使用元件化 怎麼實現元件化
為什麼要元件化
- 隨著專案的更新迭代 專案程式碼越來越複雜 每個模組之間相互依賴 更改一處程式碼 有可能要更改跟這段程式碼耦合度非常高的多處程式碼 導致增加了我們的開發時間 增加了不必要的麻煩
- 使用元件化 可以把業務模組 共同的功能性程式碼和基礎程式碼 分離出來 單獨管理 每個開發人員只負責維護自己的模組就可以了 不僅節省了開發週期 還大大降低了維護成本
元件化的細想
就好比封裝控制元件,複雜的控制元件一般都會封裝,元件化只不過是把每個模組單獨抽出來,作為一個小工程,然後在組成一個一個完整的專案
元件化的實現
- 在專案當中我們使用Cocoapod來管理我們的元件化開發
- 開啟終端 建立一個XXX專案工程 cd 到一個檔案跟目錄下
pod lib create xxx
複製程式碼
-
配置下工程資訊
-
工程配置完成 我們把我們需要的專案元件拖入到我們工程的Classes檔案中 然後 cd 進入到Example 檔案中
pod install
安裝下我們的元件
為什麼要pod install
,因為不重新pod install
Example工程根本不知道Pod更新了,pod install
的作用:重新讓pod庫與所依賴的工程檔案產生關聯
開啟 Example 檔案中的專案 Command+B 一下 如果沒有問題 就說明整合成功
- 配置描述檔案 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
複製程式碼
- 本地元件配置完成之後 就需要把本地的元件上傳的遠端私有倉庫( 上傳的程式碼就不貼出來了 網上有很多 )
注意點: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
檔案
- 把自己私有庫的索引新增到自己私有庫中
pod repo push 索引庫名稱 當前元件中podspec檔案全稱
pod repo push TcggBase TcggBase.podspec --allow-warnings
複製程式碼
本地索引庫就會有自己的私有庫,並且遠端也會有,pod repo push
會幫我們推送到遠端索引庫
開啟本地cocoapods中自己的私有庫索引地址 發現裡面已經有了 我們自己的私有庫索引 0.1.0 是我們的版本號 cocoapod 會根據Spec檔案中的tag 建立相對應的檔名稱
如果 Push
中出現的錯誤 我們也可以手動去上傳
在cocoapods 本地索引庫中 找到我們自己建立的索引庫 在我們自己建立的索引庫中 我們手動建立我們跟當前Spec檔案中 描述的版本號相符的檔案 檔名字就是我們當前元件的版本號 在把我們自己元件中的Spec檔案複製 拷貝到當前的檔案中去 就行了
######使用自己的私有索引倉庫
在 Podfile
檔案中 新增兩個 source 一個是cocoapods 公有的索引庫源 一個是我們自己的索引庫源 然後我們在pod 'xxx'
pod install
就可以了
元件化升級
- 只需要把最新的版本程式碼繫結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檔案報錯
回到程式碼檢視一下,原來載入XIB的方式如下
顯然通過載入上面的bundle的方式載入不到XIB,需要重新設定budle的路徑,修改如下:圖片資源載入問題
把元件中需要的圖片存放到Assets
中
需要修改.podspec
檔案,開啟資源的載入路徑,然後執行pod install
。然後會發現多了一個Resource
的資原始檔夾
需要改變圖片的載入方式
說明:必須指明圖片的全名和圖片所在bundle
的包名
因為涉及到@2x,@3x圖片這裡不能寫成固定的,應該按照scale來設定
因為之前設定圖片的方式都需要修改,上面修改圖片載入方式的程式碼在很多地方都會用到,所以最好的做法就是抽取一個工具方法
+ (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];
複製程式碼