美文网首页
Cocoapods管理React-native的三方库

Cocoapods管理React-native的三方库

作者: e7b2d037d29a | 来源:发表于2019-04-04 17:27 被阅读0次

    公司因需要用到React-Native开发几个项目,在接手上一个前辈的项目的时候感到头痛。

    几乎每一个三方库都要以工程的形式导入,然后需要看文档去找集成方法。当一个库出现问题或者经常性会因为npm install某个库的时候其他库出现自动删除的情况。就又要从头开始一个个的库去查找。有时一天两天的有时一周时间都在处理这样的问题。

    发现了一个比较取巧的方法是:用cocoapods来管理这些第三方库,存一份podfile文件就能一劳永宜。

    先上一份目前项目中正在用到的一些RN三方库的podfile文件:

    platform :ios, '9.0'

    target 'Personal' do

      pod 'yoga', path: '../node_modules/react-native/ReactCommon/yoga/'

      pod 'React', path: '../node_modules/react-native/', :subspecs => [

          'Core',

          'DevSupport',

        ]

      pod 'RNFS', :path => '../node_modules/react-native-fs'

      pod 'react-native-amap3d', path: '../node_modules/react-native-amap3d/lib/ios/'  #地图

      pod 'ReactNativePermissions', :path => '../node_modules/react-native-permissions' #权限管理

      pod 'RCTHttpCache', :path => '../node_modules/react-native-http-cache'            #数据请求

      pod 'RNPutiPay', :path => '../node_modules/react-native-puti-pay/ios'            #支付

      pod 'socket.io-push-oc'                                                          #socket push

      pod 'UMCShare/Social/ReducedWeChat'                                              #分享  登录

      pod 'UMCShare/Social/ReducedQQ'                                                  #分享  登录

      pod 'UMCShare/Social/ReducedSina'                                                #分享  登录

      pod 'UMCAnalytics'                                                                #统计

      pod 'react-native-async-storage', :path => '../node_modules/@react-native-community/async-storage'  #异步存储

      pod 'RNGestureHandler', :path => '../node_modules/react-native-gesture-handler'        #手势

      pod 'react-native-splash-screen', :path => '../node_modules/react-native-splash-screen'#处理白屏

    end

    post_install do |installer|

        installer.pods_project.targets.each do |target|

            targets_to_ignore = %w(React yoga)

            if targets_to_ignore.include? target.name

                target.remove_from_project

            end

    end

    end

    platform:兼容的iOS系统最低版本

    target    :工程文件名字

    后面的pod就是对应的每个三方库   path指向podspec描述文件

    再后面的post_install do |installer|是为了防止在三方库中有一些库对于RN的系统库有依赖 导致在导入三方库的时候和系统库发生冲突导致报错  duplicate XXXXXXXX

    现在的问题是有些三方库并没有提供cocoapod集成的方法那么要怎么做才能使用cocoapod来集成三方库

    例如react-native-splash-screen在文档中并没有提供cocoapod方法    但是在下载该三方库之后会发现里面有一个react-native-splash-screen.podspec文件     那么就容易了    直接 pod 'react-native-splash-screen', :path => '../node_modules/react-native-splash-screen'      path指向这个podspec文件就行了

    如果连podspec文件都不存在的库我们该怎么处理 ?

    首先我们来看一下podspec文件里面都是一些什么信息

    require "json"

    package = JSON.parse(File.read(File.join(__dir__, "package.json")))

    Pod::Spec.new do |s|
      s.name         = "react-native-splash-screen"
      s.version      = package["version"]
      s.summary      = package["description"]
      s.author       = 'crazycodeboy'
      s.homepage     = package["homepage"]
      s.license      = package["license"]
      s.platform     = :ios, "7.0"
      s.source       = { :git => "https://github.com/crazycodeboy/react-native-splash-screen", :tag => "v#{s.version}" }
      s.source_files  = "ios/*.{h,m}"
      s.dependency "React"
    end

    大致猜一下

    s.name    名字

    s.version    版本号

    s.summary    描述

    s.author   作者

    s.homepage 主页

    s.license   许可证

    s.platform   平台

    s.source  来源

    s.source_files 来源文件

    s.dependency  依赖库

    既然没有podspec文件咱给他创建一个例如react-native-zendesk-chat

    这个库在下载之后是没有podspec文件的    咱们复制一个刚才的文件到node_modules/react-native-zendesk-chat文件夹下面

    然后名字改成react-native-zendesk-chat.podspec

    里面该写什么?

    照葫芦画瓢!!

    库里面有package.json文件

    照着package.json文件把信息填上

    运行pod install

    require 'json'

    pjson = JSON.parse(File.read('package.json'))

    Pod::Spec.new do |s|

      s.name            = "UPPayControl"

      s.version         = pjson["version"]

      s.homepage        = "https://github.com/ws752958369/react-native-unionpay"

      s.summary         = pjson["description"]

      s.license         = pjson["license"]

      s.author          = { "Johannes Lumpe" => "johannes@lum.pe" }

      s.ios.deployment_target = '7.0'

      s.source          = { :git => "git+https://github.com/ws752958369/react-native-unionpay", :tag => "v#{s.version}" }

      s.source_files    = '**/*.{h,m}'

      s.preserve_paths  = "**/*.js"

      s.dependency 'React'

    end

    看到这里基本上说明我们写的本地podspec文件是没有问题的

    引用测试

    编译发现未报错  大功告成!!!

    相关文章

      网友评论

          本文标题:Cocoapods管理React-native的三方库

          本文链接:https://www.haomeiwen.com/subject/fhckeqtx.html