iosswiftreact-nativereact-native-native-moduleswift-framework

How to add a thirdparty SDK (multiple .framework files) to react native library module?


I have built a react native library module (with RN 0.63). This module depends on some thirdparty SDKs. When integrated with Android (using .aar files) it works just fine. In case of iOS, I have been able to get the library module working without the SDK (using swift hence with the bridging header). On adding the SDK, I am getting errors such as .h is not avaialble.

This is my directory My directory structure:

react-native-lib
--android
--ios
----MyCls.swift
----MyCls.m
----react-native-lib-Bridging-Header.h
----SDKS
------DEBUG
--------A.framework
--------B.framework
--------A-Debug.podspec
--------B-Debug.podspec
------THIRDPARTY
--------JSONModel.framework
--------CocoaLumberjack.framework
--------... other frameworks
--react-native-lib.podspec
--Example
--index.js
--Logger.swift
--package.json

I have a sample application in Swift which uses the SDKS folder, but I cannot seem to get RN to recognize the framework files/headers. The last few lines of the Podspec file of react-native-lib is as follows:

  ...
  s.dependency "React"
  s.dependency 'JSONModel', '~> 1.8.0'
  s.dependency 'CocoaLumberjack', '~> 3.6.1'

My example application Podfile:

require_relative '../node_modules/react-native/scripts/react_native_pods'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'

platform :ios, '11.0'
use_frameworks!

project 'example', {
    'Debug' => :debug,
    'Release' => :release,
}
#
def applibs
 pod 'A-Debug', :configuration => ['Debug'], :path  => '../node_modules/react-native-lib/ios/SDKS/DEBUG/A-Debug.podspec'
# ... A-Release, B-Debug, B-Release
# The release folders not shown in structure above.
end



target 'example' do
 config = use_native_modules!

 use_react_native!(:path => config["reactNativePath"])
  
   applibs
  
  # Disabled Flipper because of use_frameworks!
  
end

I am not sure what I am doing wrong and how I can overcome this issue. There seems to be not quite a lot of articles on how such 3rd party sdk can be integrated in a library module. I have explored similar questions like this one which is still unsolved and has insufficient information.


Solution

  • after days of research and experimenting, I have been able to resolve the problem. It's simple enough, made difficult with lack of resources on the topic.

    Primarily, I used the podspec file in my react native lib (ios folder) to add dependency on the 3rd party frameworks as follows.

    react-native-lib.podspec

      s.dependency 'A-Debug', '~> 1.2.3', :configurations => :debug
      s.dependency 'B-Debug', '~> 2.3.4', :configurations => :debug
      s.dependency 'A-Release', '~> 1.2.3', :configurations => :release
      s.dependency 'B-Release', '~> 2.3.4', :configurations => :release
    

    In my example application, the podfile works as shown above (by adding the pods in applibs). However, I encountered the 'enable bitcode' error where the compiler asked me to recompile the 3rd party libraries with bitcode enabled. I worked around it with the following post install script in the application (not library) podfile (obtained from here).

    Example/ios/Podfile

      post_install do |installer|
        installer.pods_project.targets.each do |target|
          target.build_configurations.each do |config|
            config.build_settings['ENABLE_BITCODE'] = 'NO'
          end
        end
      end
    

    Do a cache clean, and as an extra measure, clear node modules. Then simply run the following in your application directory:

    yarn install && cd ios && pod install && cd .. && yarn react-native start
    

    Open your project in Xcode and import your SDK as per its documentation. Hope this saves you hours of research, experiment and debugging.