前言:

因为项目中要使用地图相关的业务组件，安卓的同事在网上找了一个高德的三方库 react-native-amap3d，其中安卓的集成方式比较简单，iOS的集成方式却采用了cocoapod方式集成，因为公司的项目react-native 的版本是0.59.10,非>0.60 的版本，而 react-native-amap3d中展示 iOS中集成方式是错误的，无法集成成功，所有本文展示一下正确的集成方式。

正文

• 1. 编写正确的Podfile文件

platform :ios, '9.0'

target 'tmsPhone' do
  # Comment the next line if you don't want to use dynamic frameworks
  pod 'React', :path => '../node_modules/react-native', :subspecs => [
     'Core',
     'CxxBridge', # Include this for RN >= 0.47
     'DevSupport', # Include this to enable In-App Devmenu if RN >= 0.43
     'RCTText',
     'RCTNetwork',
     'RCTWebSocket', # needed for debugging
     'RCTImage',
     'RCTNetwork',
     'CxxBridge',
     'RCTAnimation',
     'RCTActionSheet',
     'RCTCameraRoll',
     'RCTLinkingIOS'
     # Add any other subspecs you want to use in your project
     # ...
    ]
  pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
  pod 'yoga', :path => '../node_modules/react-native/ReactCommon/yoga'

 # ..... 其他需要依赖的库
 # .....

end

上面是项目依赖的基础库，还需要添加其他项目中需要的基础的依赖库

初始化项目链接的库

我们可以查看项目基础的 React.podspec, 如果熟悉podspec的可以略过这段分析。

下面截取一下其中一部分分析一下：

Pod::Spec.new do |s|
  s.name                    = "React"
  s.version                 = version
  s.summary                 = package["description"]
  s.description             = <<-DESC
                                React Native apps are built using the React JS
                                framework, and render directly to native UIKit
                                elements using a fully asynchronous architecture.
                                There is no browser and no HTML. We have picked what
                                we think is the best set of features from these and
                                other technologies to build what we hope to become
                                the best product development framework available,
                                with an emphasis on iteration speed, developer
                                delight, continuity of technology, and absolutely
                                beautiful and fast products with no compromises in
                                quality or capability.
                             DESC
  s.homepage                = "http://facebook.github.io/react-native/"
  s.license                 = package["license"]
  s.author                  = "Facebook"
  s.source                  = source
  s.default_subspec         = "Core"
  s.requires_arc            = true
  s.platforms               = { :ios => "9.0", :tvos => "9.2" }
  s.pod_target_xcconfig     = { "CLANG_CXX_LANGUAGE_STANDARD" => "c++14" }
  s.preserve_paths          = "package.json", "LICENSE", "LICENSE-docs"
  s.cocoapods_version       = ">= 1.2.0"

  s.subspec "Core" do |ss|
    ss.dependency             "yoga", "#{package["version"]}.React"
    ss.source_files         = "React/**/*.{c,h,m,mm,S,cpp}"
    ss.exclude_files        = "**/__tests__/*",
                              "IntegrationTests/*",
                              "React/DevSupport/*",
                              "React/Inspector/*",
                              "ReactCommon/yoga/*",
                              "React/Cxx*/*",
                              "React/Fabric/**/*"
    ss.ios.exclude_files    = "React/**/RCTTV*.*"
    ss.tvos.exclude_files   = "React/Modules/RCTClipboard*",
                              "React/Views/RCTDatePicker*",
                              "React/Views/RCTPicker*",
                              "React/Views/RCTRefreshControl*",
                              "React/Views/RCTSlider*",
                              "React/Views/RCTSwitch*",
                              "React/Views/RCTWebView*"
    ss.compiler_flags       = folly_compiler_flags
    ss.header_dir           = "React"
    ss.framework            = "JavaScriptCore"
    ss.libraries            = "stdc++"
    ss.pod_target_xcconfig  = { "HEADER_SEARCH_PATHS" => "\"$(PODS_TARGET_SRCROOT)/ReactCommon\"" }
  end

....

 s.subspec "RCTAnimation" do |ss|
    ss.dependency             "React/Core"
    ss.source_files         = "Libraries/NativeAnimation/{Drivers/*,Nodes/*,*}.{h,m}"
    ss.header_dir           = "RCTAnimation"
  end
  s.subspec "RCTImage" do |ss|
    ss.dependency             "React/Core"
    ss.dependency             "React/RCTNetwork"
    ss.source_files         = "Libraries/Image/*.{h,m}"
  end

  s.subspec "RCTNetwork" do |ss|
    ss.dependency             "React/Core"
    ss.source_files         = "Libraries/Network/*.{h,m,mm}"
  end

  ......

我们库文件是 React,分了很多个子库，子库中申明依赖 dependency 和 source_files, 同样主库文件定义库文件描述。

我们需要在 Podfile 根据需要，引入的库文件名字。

根据我项目例子，举个例子添加一个依赖库 react-native-image-picker

• 找到 react-native-image-picker 的文件目录

node_modules/react-native-image-picker

• 查看 react-native-image-picker.podspec 文件

require 'json'

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

Pod::Spec.new do |s|
  s.name         = package['name']
  s.version      = package['version']
  s.summary      = package['description']
  s.license      = package['license']

  s.authors      = package['author']
  s.homepage     = package['homepage']
  s.platform     = :ios, "7.0"

  s.source       = { :git => "https://github.com/react-native-community/react-native-image-picker.git", :tag => "v#{s.version}" }
  s.source_files  = "ios/*.{h,m}"

  s.dependency 'React'
end

name 需要从 package.json 中查看，即 react-native-image-picker

同样在 Podfile 中添加依赖

pod 'react-native-image-picker', :path => '../node_modules/react-native-image-picker'

这样我们把项目需要的依赖库都按照这样的添加到 Podfile文件中。

• 2.删除 Libraries
  选择 Remove Reference
  

  

• 3.执行 pod install

• 4. 选择 .xcworkspace 打开项目即可。

结尾

当然在项目中我们会遇到各种各样的问题，其实大多数是cocoapods 引入的相关问题，大家有问题可以留言。