iOS组件化

作者: CrystalZhu | 来源:发表于2020-02-25 11:43 被阅读0次

iOS组件化
iOS组件化方案
iOS 组件化整理
iOS项目组件化搭建
iOS学习之入门组件化
iOS组件化实践（基于CocoaPods）
组件化方案
iOS组件化（二）----- 组件的更新
iOS组件化（一）----- 创建私有组件库（在码云上操作）
IOS工具（二）cocoapod 实现 ios 组件化

首先为什么需要组件化？

下面我列举了一些比较常见的问题

业务模块划分不清楚，各模块之间耦合度很大，难以维护
- 例如我们公司的商城项目随着功能和时间，代码量越来越大，早期的一些代码已经不需要了，但是不敢轻易删除，不敢保证该文件是够有被使用。
- 就算手动去查找删除，也是一件治标不治本的方法，等过一段时间还会出现这种问题
所有模块代码都编写在一个项目中，测试某个模块或功能的时候，需要编译运行整个项目
- 这一点在做自动化测试的时候尤其明显，如果某个地方出现问题，现在就无法再继续进行测试了
复用性不好，需要经常造轮子
- 在我们的项目中，如果之前的开发人员离职了，那么他造过哪些轮子，经常后续的开发人员是不了解不清楚的。
- 如果又需要做一些类似的功能，新的开发人员有需要重复造轮子
开发效率很低，分工不明确
- 如果有新人加入项目，不能保证可以立刻投入开发。需要较长的时间来熟悉代码，且新人在熟悉代码的过程也容易走弯路。

组件化解决问题的思路

利用中间层来做到：只让别的模块对中间层产生耦合，中间层不对其他模块产生耦合
关于这个中间层，这个问题在这里我们就不深究了，大家可以参考蘑菇街解决思路。

组件化的目的

我们可以讲每一个模块作为一个组件。并且建立一个主项目，这个朱羡慕负责集成所有组件。
好处：

业务划分清晰，新人接受项目容易，不同的组件是不同的开发任务，大组件下的小组件是一个小的开发任务
项目维护性更强，需要什么功能，很好找到，提高了开发的销量。
能够更好的发现问题并找到问题，当某个地方出现问题了，可以直接对该组件进行处理，处理好了更新组件就好。
开发和测试的时候，可以只编译自己写的代码，不需要编译全部项目。测试人员也可以测试单个组件。

在这里需要解释一下什么是组件？

一个分类可以是一个组件，一个轮播图也可以是一个组件，一个Controller也是一个组件，甚至一个首页模块(包含内部的所有Controller和业务)，都可以是一个组件。

像分类这种被称为基础组件，轮播图这种被称为UI组件，Controller和首页模块这种被称为业务组件。从前到后，从简单到复杂，都是组件。

我们应该怎么做？

在组件化的架构中，有一个主项目用来负责集成其余组件。每一个组件又是一个单独的工程。

组件只需要对外提供服务，通过中间件来调用这些服务。

在这里将通过iOS的cocoapods私有库的形式来完成一个组件化的示例。

以cocoapods的AFNetworking为例。

image

当我们使用pod search AFNetworking的时候，就是去cocoapods的Specs索引中找到AFNetworking的配置信息，然后通过这个配置信息，配置信息包含的在github上的代码地址，去获得对应的代码。

现在我们要做的就是按照cocoapods官方的这一套来生成我们自己的一套，我们自己生成一个非官方的Specs索引，在这个索引里只存放公司的库索引，也就是一个个组件，这些组件的具体地址，放到我们想放到的地址下面。如coding私有库，码云，公司部署的gitlab等。

简单的来说就是仿照上图的这三个东西。

准备工作

本地的cocoapods必须要安装好，如何安装cocoapods，这里就不写了

成员划分

组件化主要负责人：负责建立最基本的Spec索引，搭建宿主项目，合并业务组件到宿主工程(理想状况下)
团队开发者：编写组件，更新组件。

详细步骤

编写组件代码，比如一个轮播图，一个数据库工具等，具体写代码的过程就不说了，这里我使用小码哥的代码来做示范，因为这个实践的文档也是基于一位讲师的文章来做的。

下面是编写好的代码，在这里分了两个模块，一个是Base，一个是Category。这两个模块不依赖于任何别的第三方文件和库。
image
建立自己的Spec索引，这里我们建立在码云上，因为码云免费且没有项目个数的限制。在这里我的Spec项目名为LJDemoSpecs，这里我没有添加ReadMe和.gitignore文件，因此会提示添加readme和lisence。
image

现在我们将整个建立的podSpecs添加到我们本地的pod索引中，这里会验证一下用户名和密码。

image

现在前往电脑中的个人下的.cocoapods文件夹，可以看到repos下面有两个文件夹，一个是master，一个是LJDemoSpecs。

image

master是cocoapods的官方索引库，而LJDemoSpecs是刚才我们建立的私人的索引库，现在里面还什么都没有。

这里想要查看.cocoapods文件夹需要开启显示隐藏文件的权限

现在利用pod来生成一个组件化的项目，这个项目的名字叫做LJDemoBase。

这里不通过xcode来建立project，而是使用pod命令来直接生成组件化的项目。

这里的命令就是pod lib create LJDemoBase，它会从cocoapods的模板中给你clone一个项目。
- 询问你使用的语言
- 是否需要demo工程
- 是否使用测试framework
- 是否基于View测试
- 类的前缀
输入完毕后稍等片刻，xcode会自动打开这个项目，我把全部的命令贴一下
image
下面是自动生成的pod项目的目录结构
- Example主要存放对应的demo
- LJDemoBase主要存放代码和需要的资源
- 而podspec文件则是记录着当前组件的相关信息，包括git地址，对应的描述，需要依赖的库等等。
- 右侧的信息不用填写，后面再填写
  image
现在把第一步中的代码添加到这个pod项目中，添加代码的方法有好几种，这里我仅仅写我使用的方法。
1. 在对应的Example中编写调试代码，编写完成后如下图所示

image

代码已经写完了，也调试好了。现在将对应的代码放到LJDemoBase下的Classes文件夹下，将Classes下已有的Relpace文件删除。

这里我们直接在finder里操作，不是在Example的workspace操作。
image
现在删除Example项目中的的Base和Category，然后在Example目录下使用命令pod install。对应的结果如下
image
再次查看LJDemoBase.xcworkspace，可以看到对应的代码已经自动被放到Development Pods下面了。
image
现在如果这就是我们这个小组件的第一个版本，当前代码只是写在本地，需要将他放到远程仓库上。我们在gitoschina建立一个对应的仓库。

建立好以后如下图所示：
image

这里任然不添加ReadMe和.gitignore文件，因为pod lib create创建的项目里已经有这两个文件了

代码虽然已经写完了，但是对应的配置信息却一点都没有写，现在来把配置信息补齐。

Pod::Spec.new do |s|
  s.name             = 'LJDemoBase'                         #名称
  s.version          = '0.1.0'                              #版本号
  s.summary          = 'A short description of LJDemoBase.' #简短介绍，下面是详细介绍

# This description is used to generate tags and improve search results.
#   * Think: What does it do? Why did you write it? What is the focus?
#   * Try to keep it short, snappy and to the point.
#   * Write the description between the DESC delimiters below.
#   * Finally, don't worry about the indent, CocoaPods strips it!

  s.description      = <<-DESC
TODO: Add long description of the pod here.
                       DESC
  #主页,这里要填写可以访问到的地址，不然验证不通过
  s.homepage         = 'https://gitee.com/lj360691676/LJDemoBase'
  #截图
  # s.screenshots     = 'www.example.com/screenshots_1', 'www.example.com/screenshots_2'
  #开源协议
  s.license          = { :type => 'MIT', :file => 'LICENSE' }

  #作者信息
  s.author           = { 'liangjian' => '360691676@qq.com' }
  #项目地址，这里不支持ssh的地址，验证不通过，只支持HTTP和HTTPS，最好使用HTTPS
  s.source           = { :git => 'https://gitee.com/lj360691676/LJDemoBase.git', :tag => s.version.to_s }

  #多媒体介绍地址
  # s.social_media_url = 'https://twitter.com/<TWITTER_USERNAME>'

  #支持的平台及版本
  s.ios.deployment_target = '8.0'

  #代码源文件地址，**/*表示Classes目录及其子目录下所有文件，如果有多个目录下则用逗号分开，如果需要在项目中分组显示，这里也要做相应的设置
  s.source_files = 'LJDemoBase/Classes/**/*'

  #资源文件地址
  # s.resource_bundles = {
  #   'LJDemoBase' => ['LJDemoBase/Assets/*.png']
  # }

  #公开头文件地址
  # s.public_header_files = 'Pod/Classes/**/*.h'

  #所需的framework，多个用逗号隔开
  # s.frameworks = 'UIKit', 'MapKit'

  #依赖关系，该项目所依赖的其他库，如果有多个需要填写多个s.dependency
  # s.dependency 'AFNetworking', '~> 2.3'
end

在上面已经将对应的参数通过备注的形式解释了，下面我贴一下我这个组件的podspec的截图，划线部分是修改过的地方。

image

由于不要依赖第三方库和别的资源文件，因此s.dependency和s.resource_bundles都没有打开注释。

现在本地LJDemoBase代码和对应LJDemoBase的podspec都搞好了，LJDemoBase的远程仓库也建立好了，现在把本地和远程的库关联起来。

下面的操作基于LJDemoBase主文件夹：
image
做完上面的这些操作，再来看oschina上的对应仓库，对应的内容已经全部同步了
image

现在本地和远程仓库已经关联了

在我们使用cocoapods的过程中，常常会发现当搜索某个库的时候会有对应的Version,可以使用指定版本的代码来集成到项目中，如下图所示

```
-> AFNetworking (3.1.0)
A delightful iOS and OS X networking framework.
pod 'AFNetworking', '~> 3.1.0'
- Homepage: https://github.com/AFNetworking/AFNetworking
- Source:   https://github.com/AFNetworking/AFNetworking.git
- Versions: 3.1.0, 3.0.4, 3.0.3, 3.0.2, 3.0.1, 3.0.0, 3.0.0-beta.3, 3.0.0-beta.2, 3.0.0-beta.1, 2.6.3, 2.6.2, 2.6.1,
2.6.0, 2.5.4, 2.5.3, 2.5.2, 2.5.1, 2.5.0, 2.4.1, 2.4.0, 2.3.1, 2.3.0, 2.2.4, 2.2.3, 2.2.2, 2.2.1, 2.2.0, 2.1.0,
2.0.3, 2.0.2, 2.0.1, 2.0.0, 2.0.0-RC3, 2.0.0-RC2, 2.0.0-RC1, 1.3.4, 1.3.3, 1.3.2, 1.3.1, 1.3.0, 1.2.1, 1.2.0, 1.1.0,
1.0.1, 1.0, 1.0RC3, 1.0RC2, 1.0RC1, 0.10.1, 0.10.0, 0.9.2, 0.9.1, 0.9.0, 0.7.0, 0.5.1 [master repo]
- Subspecs:
  - AFNetworking/Serialization (3.1.0)
  - AFNetworking/Security (3.1.0)
  - AFNetworking/Reachability (3.1.0)
  - AFNetworking/NSURLSession (3.1.0)
  - AFNetworking/UIKit (3.1.0)

```

`Version`对应相关版本的代码，通过`git tag`的形式来做到区分版本。

下面我们也给当前的代码制定一下版本，命令非常简单，如下所示就是打了个0.1.0的`tag`

![image](https://img.haomeiwen.com/i2330500/ef9e44dc46d28bc8.png?imageMogr2/auto-orient/strip|imageView2/2/w/1200)

查看远程仓库，可以看到这就是刚才的tag

image

现在一切准备就绪，需要将我们写的这个组件的配置信息加入到私有的pod索引里去，也就是第二步中那个Spec索引。
还是在当前打tag的目录执行下面的命令

![image](https://img.haomeiwen.com/i2330500/5b76ce5f5dc4bb22.png?imageMogr2/auto-orient/strip|imageView2/2/w/1200)

下面来看看本地和远程的索引库，发现现在都有啦

上面的命令会自动帮我们同步到本地和远程

image

下面来检索这个LJDemoBase，可以看到下面的。

![image](https://img.haomeiwen.com/i2330500/27ccc5a5cc78732f.png?imageMogr2/auto-orient/strip|imageView2/2/w/1200)

发现搜索不到，这是缓存的问题

  输入`rm ~/Library/Caches/CocoaPods/search_index.json`然后重新搜索

现在通过xcode建立主工程LJDemoProject，建立好项目之后使用pod初始化后如图

![image](https://img.haomeiwen.com/i2330500/471bca91eccb8845.png?imageMogr2/auto-orient/strip|imageView2/2/w/898)

打开LJDemoProject.xcworkspace，编辑Podfile文件，添加source

> 添加`source`的目的:默认情况下`cocoapods`指定使用官方的索引，这里我们不仅要使用官方，也要使用个人私有的索引

修改后的文件内容如下:

![image](https://img.haomeiwen.com/i2330500/87e16e18f5af2ad7.png?imageMogr2/auto-orient/strip|imageView2/2/w/1200)

至于怎么看source的地址，使用下列命令pod repo

      liangdeiMac:LJDemoBase apple$ pod repo
      LJDemoSpecs
      - Type: git (master)
      - URL:  https://gitee.com/lj360691676/LJDemoSpecs.git
      - Path: /Users/devliang/.cocoapods/repos/LJDemoSpecs
      master
      - Type: git (master)
      - URL:  https://github.com/CocoaPods/Specs.git
      - Path: /Users/apple/.cocoapods/repos/master
      2 repos

现在在Podfile文件的的父目录下pod insatll
打开LJDemoProject.xcworkspace会看到如下图所示，这样我们的组件就被集成进项目里了

![image](https://img.haomeiwen.com/i2330500/abb08a1761c5f7a3.png?imageMogr2/auto-orient/strip|imageView2/2/w/1200)

到这里我们制作集成组件就讲的差不多了，下面是补充一些相关的东西

如何细分组件，给组件划分模块
如何给组件添加依赖
如何更新组件
如何给组件添加资源文件
多人协作开发时，如何做到组件化开发

细分组件

在组件的开发过程中，常常会对组件进行结构划分，例如上面的组件划分为Base和Category，虽然在物理文件夹上将这两个模块的代码分开了。但是在使用代码的过程中却并没有分开，就像15步的最后那张图，这两部分的代码最后被一起放到了LJDemoBae下。

其实在使用cocoapods的过程中，会发现有一个Subspecs字段，这就是对应的组件细分，如下面的AFNetworking所示。

-> AFNetworking (3.1.0)
      A delightful iOS and OS X networking framework.
      pod 'AFNetworking', '~> 3.1.0'
      - Homepage: https://github.com/AFNetworking/AFNetworking
      - Source:   https://github.com/AFNetworking/AFNetworking.git
      - Versions: 3.1.0, 3.0.4, 3.0.3, 3.0.2, 3.0.1, 3.0.0, 3.0.0-beta.3, 3.0.0-beta.2, 3.0.0-beta.1, 2.6.3, 2.6.2, 2.6.1,
      2.6.0, 2.5.4, 2.5.3, 2.5.2, 2.5.1, 2.5.0, 2.4.1, 2.4.0, 2.3.1, 2.3.0, 2.2.4, 2.2.3, 2.2.2, 2.2.1, 2.2.0, 2.1.0,
      2.0.3, 2.0.2, 2.0.1, 2.0.0, 2.0.0-RC3, 2.0.0-RC2, 2.0.0-RC1, 1.3.4, 1.3.3, 1.3.2, 1.3.1, 1.3.0, 1.2.1, 1.2.0, 1.1.0,
      1.0.1, 1.0, 1.0RC3, 1.0RC2, 1.0RC1, 0.10.1, 0.10.0, 0.9.2, 0.9.1, 0.9.0, 0.7.0, 0.5.1 [master repo]
      - Subspecs:
        - AFNetworking/Serialization (3.1.0)
        - AFNetworking/Security (3.1.0)
        - AFNetworking/Reachability (3.1.0)
        - AFNetworking/NSURLSession (3.1.0)
        - AFNetworking/UIKit (3.1.0)

下面要做到导入组件的时候会自动将已经划分好的目录结构导入，并且还能够按需导入，比如说我只需要Base那么可以只导入该组件下的Base，而不会将其他文件导入。

其实文件的目录划分在上面已经做好了（这里我是之前划分好了，你如果没划分是要划分的），现在这里只需要配置一下Specs就可以了。

如下图所示，修改的地方我都已经标注好了
image
现在提交新的代码，提交代码加打tag都放在下面了
image image image
更新spec索引pod repo push LJDemoSpecs LJDemoBase.podspec。
image
搜索组件pod search ljdemobase，如下图所示，现在的Versions有0.1.0和0.2.0，且Subspecs有Base和Category了。
image
现在更新一下LJDemoProject项目中使用到的组件，pod update --no-repo-update，至于为什么要加后面的参数是因为不如不加的话会更新pod官方索引，需要的时间比较长，我们不想更新官方的索引。
image
现在再看一下项目中用到的这个组件，发现现在对应的目录结构已经分好了。

image

如果现在只想使用组件中的一个子组件，那么在Podfile中可以写作如下所示

image

修改完毕以后再使用pod update --no-repo-update重新安装一下依赖组件即可

如何给组件添加依赖

在制作组件的过程中，常常需要依赖一些第三方的框架，常见的如AFNetworking和SDWebimage等，下面讲解一下如何添加依赖。

添加依赖的是公开的代码，如AFNetworking
1. 添加的配置信息是写在组件的podspec文件里，很简单如下所示
  image

更新到远程仓库，打tag并更新Spec索引
image
在项目中使用新版本的组件，下面的命令是在LJDemoProject项目下
image

执行完上面的命令，现在来看一下项目中的依赖库

image

如果需要给某个组件的子组件添加依赖库，那么podspec文件写作如下所示

这里我只截图了两部分的内容，上图为代码添加，下图为spec的修改
image image
上面的工作都做完以后，现在执行我们的更新组件三部曲
- 推送组件代码到远程，打tag,这里我直接贴图了，下面的命令在上面的讲解中我已经讲过很多次了
  image

更新spec索引pod repo push LJDemoSpecs LJDemoBase.podspec。

image

先修改LJDemoProject项目中的Podfile。

这里分两种，一种子组件不依赖第三方，一种的子组件依赖第三方
- 不依赖第三方，pod 'LJDemoBase/Category'
- 依赖第三方，pod ‘LJDemoBase’, :subspaces =>[‘Category’, ‘Network’]
在项目中使用新版本的组件，下面的命令是在LJDemoProject项目下
image
子组件不依赖第三方
image
子组件依赖第三方
image

可以很清晰的看到，子组件如果依赖第三方库，当使用子组件的时候会自动帮我们安装依赖的三方库，而如果没有使用依赖三方库的子组件，并不会安装对应的第三方库

添加依赖的是私有库，比如前面写了个LJDemoBase，现在又要创建一个新的组件叫LJDemoView，它依赖于LJDemoBase
先创建对应的pod lib
image

在LJDemoView的Podfile中添加对应的私有pod索引，如下图所示

看清楚，这里是LJDemoView的Podfile
image
在LJDemoView的LJDemoView.podspec下添加依赖，下图中不仅添加了依赖，描述，git地址等配置信息都填好了(因为这是一个新的组件)
image

推送代码到远程仓库，打tag并更新Spec索引，下面我只贴命令了，相信大家已经知道用什么命令了（前面敲了n次）

liangdeiMac:LJDemoView apple$ git add .
liangdeiMac:LJDemoView apple$ git commit -m"initial LJDemoView with first version"
liangdeiMac:LJDemoView apple$ git remote add origin https://gitee.com/lj360691676/LJDemoView.git
liangdeiMac:LJDemoView apple$ git push origin master
liangdeiMac:LJDemoView apple$ git tag
liangdeiMac:LJDemoView apple$ git tag 0.1.0
liangdeiMac:LJDemoView apple$ git push --tags
liangdeiMac:LJDemoView apple$ pod repo push LJDemoSpecs LJDemoView.podspec --allow-warnings

在LJDemoProject下的Podfile中添加新的组件，这里为了区别之前的LJDemoBase组件，把之前的组件注释掉
image

重新安装组件

   liangdeiMac:LJDemoView apple$ cd /Users/apple/Documents/LJDemo/LJDemoProject
   liangdeiMac:LJDemoProject apple$  pod update --no-repo-update

重新安装后的项目pod依赖如下

image

组件直接的相互依赖就说到这里，如果还有问题可以参看下面的官方文档的介绍

https://guides.cocoapods.org/syntax/podspec.html

如何更新组件

添加对应的代码，修改podspec文件，推送到远程
打tag并推送tag
更新spec索引，如pod repo push LJDemoSpecs LJDemoBase.podspec
使用组件，在项目的Podfile中添加

我这里只是写的大体步骤，具体步骤上面做了很多次了，相信都已经很了解了

如何给组件添加资源文件

在开发组件的过程中，常常需要用到一些资源文件，常见的如图片，xib等。

这里我就不花大篇幅来讲了，大家可以看这个老师写的添加组件资源的博客

教你如何从0到1实现组件化架构

多人协作开发时，如何做到组件化开发

经过上面的讲解，相信大家应该知道怎么来制作更新一个组件了，但是上面的一切都是基于个人的操作，如何在团队中能够开发并使用是接下来讨论的问题。

这里我是基于oschina建立了一个组织，组织里就是公司的同事。

完成后的组织结构如下图所示

image

重要：下面的操作是在另一位同事的电脑上，这个同事叫MT

将LJDemoSpecs的内容clone到本地。

这里的本地地址为：前往电脑中的个人下的.cocoapods文件夹，可以看到repos下面有一个文件夹master，master里存放的官方的库索引，我们现在要加入组织的私有库索引LJDemoSpecs。

下面我贴下命令
```
MTdeiMac:~ apple$ cd /Users/apple/.cocoapods/repos
MTdeiMac:repos apple$ git clone https://gitee.com/j1-iOS/ljdemospecs.git
```
做完上面的操作，如下图所示
image

现在通过pod repo可以看到有两个库索引，如下图

image

现在可以把放在oschina上的组件和项目都clone下来，然后和文章前面所讲的一样来进行组件的开发和项目的开发了。

参考资料：

转自：https://www.jianshu.com/p/2ff2a0cc9373

iOS组件化
iOS组件化 iOS组件化
iOS组件化方案
iOS组件化方案 iOS组件化方案
iOS 组件化整理
iOS 组件化整理 iOS 组件化整理
iOS项目组件化搭建
iOS项目组件化搭建 iOS项目组件化搭建
iOS学习之入门组件化
iOS学习之入门组件化 iOS学习之入门组件化
iOS组件化实践（基于CocoaPods）
iOS组件化实践（基于CocoaPods） iOS组件化实践（基于CocoaPods）
组件化方案
组件化方案引用在现有工程中实施基于CTMediator的组件化方案 iOS组件化实践(一)：简介 iOS组件化实...
iOS组件化（二）----- 组件的更新
组件化系列传送门 iOS组件化（一）----- 创建私有组件库（在码云上操作）iOS组件化（二）----- 组件...
iOS组件化（一）----- 创建私有组件库（在码云上操作）
组件化系列传送门 iOS组件化（一）----- 创建私有组件库（在码云上操作）iOS组件化（二）----- 组件...
IOS工具（二）cocoapod 实现 ios 组件化
@[TOC](cocoapod 实现 ios 组件化) cocoapod 实现 ios 组件化一 cocoa ...

iOS组件化

首先为什么需要组件化？

组件化解决问题的思路

组件化的目的

我们应该怎么做？

准备工作

成员划分

详细步骤

到这里我们制作集成组件就讲的差不多了，下面是补充一些相关的东西

细分组件

如何给组件添加依赖

如何更新组件

如何给组件添加资源文件

多人协作开发时，如何做到组件化开发

相关文章

iOS组件化

iOS组件化方案

iOS 组件化整理

iOS项目组件化搭建

iOS学习之入门组件化

iOS组件化实践（基于CocoaPods）

组件化方案

iOS组件化（二）----- 组件的更新

iOS组件化（一）----- 创建私有组件库（在码云上操作）

IOS工具（二）cocoapod 实现 ios 组件化

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读