iOS组件化从0到1详解

lanlinxl
1,996 阅读5分钟

目录

1.github创建远程仓库

2.创建本地组件代码库

3.组件提交到github仓库

4.组件发布到CocoaPods

5.项目导入组件

6.常见错误

1.github创建远程仓库

  • 1.进入github页面，找到新建按钮 Snipaste_2021-07-28_17-49-50.png

  • 2.创建一个仓库 Snipaste_2021-07-29_14-12-25.png

  • 3.创建完成，获取到仓库的url地址 Snipaste_2021-07-29_17-15-50.png

  • 4.将这个url使用git命令或者Sourcetree克隆到本地就可以使用github管理相关代码啦

2.创建本地组件代码库

1.安装cocoapods

如果没有安装cocoapods，需要先安装，教程很多这里找了一一篇文章Cocoapods安装

2.创建pod账号：

把组件发布到cocoapods上需要有一个pod的账号，可以使用命令pod trunk me 来查看自己的账号信息，如果没有账号的话需要先注册一下：
注册命令：

pod trunk register 邮箱 姓名

示例： Snipaste_2021-07-23_20-40-31.png 注册完成后，可以再 pod trunk me 检查一下是否成功了

3.创建本地组件代码库
  • 创建命令：

pod lib create <组件名>

  • 示例(终端最好开启代理，否则容易报错)：

pod lib create LLComponentDemon

  • 执行结果会问一些问题:

What is your email? 你的邮箱
What platform do you want to use?? [ iOS / macOS ] 选择的平台
What language do you want to use?? [ Swift / ObjC ] 选择开发语言
Would you like to include a demo application with your library? [ Yes / No ] 是否自动生成一个用来做demo测试的模板库
Which testing frameworks will you use? [ Quick / None ] 是否集成测试框架
Would you like to do view based testing? [ Yes / No ] 是否做基于View的测试

  • 示例（根据自己实际需求选择即可）:

What is your email?

  • lanlin0806@icloud.com What platform do you want to use?? [ iOS / macOS ]
  • iOS What language do you want to use?? [ Swift / ObjC ]
  • Swift Would you like to include a demo application with your library? [ Yes / No ]
  • Yes Which testing frameworks will you use? [ Quick / None ]
  • None Would you like to do view based testing? [ Yes / No ]
  • No

上面的步骤完成后会得到一个项目文件，大致情况如下：
项目目录：
Snipaste_2021-07-29_14-18-29.png

Example项目文件目录:
Snipaste_2021-07-29_14-17-45.png

4.项目组件添加组件代码
  • 添加的组件代码放在LLComponentDemon -> Classes 文件夹中

Snipaste_2021-07-29_14-19-17.png

  • 添加文件，添加一个LLTest组件文件，ReplaceMe.swift文件可以删除

Snipaste_2021-07-29_14-20-13.png

  • 将添加的组件文件Pod到Example文件夹中

1.进入Example文件夹（有Podfile的文件夹）
2.执行 pod install 命令 Snipaste_2021-07-29_14-49-09.png

  • 执行完成后工程目录就可以看到组件文件在Pods里面了

Snipaste_2021-07-29_14-47-46.png

备注：需要把组件类及相关对外方法用public声明，否则外部调用不到报错
如LLtest类没有用public修饰，外部则无法调用到： 截屏2021-07-28 下午8.52.34.png

至此我们本地的组件代码库就已经完成了，我们可以将组件代码放在本地用pod install导入使用。

3.组件提交到github仓库

1.修改.podspecs索引文件
打开工程中的LLComponentDemon.podspec文件

Pod::Spec.new do |s|
  s.name             = 'LLComponentDemon'  #1.组件名称
  s.version          = '0.0.1' #2.版本号，与tag值一致
  s.summary          = 'This is a Demon' #3.组件描述

  #4.描述
  s.description      = <<-DESC 
TODO: Add long description of the pod here.
                       DESC
                       
  s.homepage         = 'https://github.com/lanlinxl/LLComponentDemon' #5.组件主页
  s.license          = { :type => 'MIT', :file => 'LICENSE' } #7.组件使用协议
  s.author           = { 'lanolin' => 'lanlin0806@icloud.com' } #8.作者
  
  #9.github的远程仓库索引
  s.source           = { :git => 'https://github.com/lanlinxl/LLComponentDemon.git', :tag => s.version.to_s }  
  
  s.ios.deployment_target = '9.0' #10.最低支持版本
  s.source_files = 'LLComponentDemon/Classes/**/*' #11.组件文件路径
  s.swift_version = '5.0' #12.swift支持的版本
  # s.dependency 'AFNetworking', '~> 2.3' #13.组件依赖库
end

上面文件必须要更改的是：

  • 第3处不更改，后台发布会报警告

  • 第5处生成的可能是默认地址，不是你的github仓库地址

  • 第9处生成的也可能是默认索引，不是你的github远程仓库索引

  • 第13处为依赖组件，如果组件有依赖于其它组件，则需要放开此处注释，将组件引用进来，并且同时还需要在Podfile中添加依赖的组件，以保证项目能编译通过。

  • 如果想要了解更多podspec的设置可以参考 podspec 常用语法和子目录

2.提交github仓库
首先cd到LLComponentDemon根目录
命令如下：

git add .
git commit -m "提交说明"
git remote add origin 远程代码仓库地址
git push origin master
git tag 版本号 （注：这里的版本号必须和.podspec里写的版本号一致,否则验证cocoaPods索引文件会报错）
git push --tags

  • 示例：

git add .
git commit -m "1.0.0版本发布"
git remote add origin github.com/lanlinxl/LL…
git push origin master
git tag 1.0.0
git push --tags

  • 重复使用 git remote add origin .. 到相同的仓库会报如下错误

error: remote origin already exists. 需要调用git remote rm origin解决

4.组件发布到CocoaPods

1.验证cocoaPods索引文件
cd到LLComponentDemon根目录执行下面命令

pod spec lint --verbose --allow-warnings

  • 验证成功打印:

Snipaste_2021-07-29_16-14-21.png

  • 验证失败： 检查一下.podspec文件里面的版本号是否和上面的 git tag 版本号一致

2.发布组件
在有.podspec文件的组件工程根目录执行，这里还是LLComponentDemon根目录

命令如下：

pod trunk push xxxx.podspec

示例：

pod trunk push LLComponentDemon.podspec

如果配置报警告的话，则需要在后面加--allow-warnings允许警告

pod trunk push TShareView.podspec --allow-warnings

至此组件已经全部完成啦，我们可以使用pod trunk me 查看是否已经成功发布了， 也可以去cocopods官网直接搜索组件（有缓存需要等几分钟）

5.项目导入组件

1.cd到项目有Podfile文件的目录 2.podfile文件添加组件名 Snipaste_2021-07-29_17-04-32.png

3.终端执行命令 pod install Snipaste_2021-07-29_17-07-11.png

4.项目中使用组件： Snipaste_2021-07-29_17-06-57.png

大功告成～

常见错误

  1. git push origin master 报错

git push error: failed to push some refs to ... 我们需要先将远程代码库中的任何文件先pull到本地代码库中，才能push新的代码到github代码库中。 解决：git pull --rebase origin master

2.当我们的组件包含OC的framework的头文件时，可能存在头文件找不到的情况：
解决：找到路径 Build Settings -> User Header Search Paths
添加 $(PODS_ROOT) 并设置为 recursive

Snipaste_2021-07-29_16-19-14.png

  1. 执行pod trunk push 时报了下面这个错误：

[!] Authentication token is invalid or unverified. Either verify it with the email that was sent or register a new session.

解决：

  1. 执行命令：pod trunk register '你的邮箱' 'XXXXXX' --description='XXXX' 重新注册一下账号。
  2. 在自己邮箱里面找到并打开验证链接。
  3. 返回终端重新执行命令：pod trunk push XXXXX.podspec --allow-warnings
  • 关于组件化暂时就写到这里啦，有纰漏之处，欢迎指正 Demon地址
avatar
文章
阅读
粉丝