React dependency in react-native module's podspec

Question

I'm looking at source code of Microsoft's Mobile center SDK for react-native. There are several native modules for react-native, and the recommended way to install them is via Cocoapods.

Now, each module has podspec, but none mention React as dependency. For example, appcenter-crashes.podspec has these dependencies:

s.dependency 'AppCenterReactNativeShared'
s.dependency 'AppCenter/Crashes'

And AppCenterReactNativeShared.podspec has just

s.dependency 'AppCenter/Core', '1.1.0'

Yet the module are react-native bridges and depend on React and import from React in their sources. For example, AppCenterReactNativeCrashes.m has these lines:

#import "AppCenterReactNativeCrashes.h"

// Support React Native headers both in the React namespace, where they are in RN version 0.40+,
// and no namespace, for older versions of React Native
#if __has_include(<React/RCTAssert.h>)
#import <React/RCTAssert.h>
#import <React/RCTBridgeModule.h>
...

Next, in my react-native project I can link mobile center and build and run my app with Podfile like this:

target 'example' do
  pod 'AppCenter/Crashes', '~> 1.0.1'
  pod 'AppCenter/Analytics', '~> 1.0.1'
  pod 'AppCenterReactNativeShared', '~> 1.0.1'
end

Again, I don't need to mention React pod and its subspecs here!

Now in my own react-native native module I have to declare dependencies like:

s.dependency 'React'
s.dependency 'some-other-dependency-my-module-needs'

And then in my app's Podfile I have include React pod:

pod 'yoga', path: "#{rn_path}/ReactCommon/yoga/yoga.podspec"
pod 'React', path: rn_path, subspecs: [
  'Core',
  'RCTActionSheet',
...

If I don't include React in native module podspec then I get error fatal error: 'React/RCTBridgeModule.h' file not found. If I don't add React to Pofile, then Cocoapods drags deprecated React pod from its repository and the build breaks.

So, my question is how is it possible that mobile center native modules do not have React in their podspecs and how can I get rid of it in my native module?

Di Hei · Accepted Answer · 2017-12-13 01:04:10Z

2

Let me explain how "greenfield" (react native app created from scratch) and "brownfield" (existing Objective-C/Swift app migrated to react native) iOS apps work for App Center React Native SDK.

For "greenfield" React Native app created from scratch, whether it is created via react-native init {myapp} or via create-react-native-app {myapp}, react and react-native dependencies are added automatic during the creation and referenced in your package.json.

For "brownfield" React Native app, assuming you followed the React Native Integration with Existing Apps documentation to convert your Objective-C/Swift app into React Native, you need to reference React dependencies in your Podfile like the example in Configuring CocoaPods dependencies:

# The target name is most likely the name of your project.
target 'NumberTileGame' do

  # Your 'node_modules' directory is probably in the root of your project,
  # but if not, adjust the `:path` accordingly
  pod 'React', :path => '../node_modules/react-native', :subspecs => [
    'Core',
    'DevSupport', # Include this to enable In-App Devmenu if RN >= 0.43
    'RCTText',
    'RCTNetwork',
    'RCTWebSocket', # needed for debugging
    # Add any other subspecs you want to use in your project
  ]
  # Explicitly include Yoga if you are using RN >= 0.42.0
  pod 'yoga', :path => '../node_modules/react-native/ReactCommon/yoga'

  # Third party deps podspec link
  pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
  pod 'GLog', :podspec => '../node_modules/react-native/third-party-podspecs/GLog.podspec'
  pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'

end

You can take a look at the Podfile of the sample "brownfield" app in App Center SDK. In this example, React is reference in the Podfile and it is required for the brownfield app to find react references. In other words, without React reference in Podfile, you will see errors similar to fatal error: 'React/RCTBridgeModule.h' file not found.

answered Dec 13, 2017 at 1:04

Di Hei

511 silver badge7 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Konstantin Kuznetsov Over a year ago

Thank you. My app is greenfield (created in RN from scratch), but it has native dependencies - some native modules like react-native-maps, react-native-config, and AppCenter is one of those deps. When I do react-native link, some of the deps are added directly to xcode project, and since RN0.51 those which have podspec will be instead added to Podfile. So I have an app with podfile like this - without React and subspecs. And it builds and runs. But for my module I have to add React to Podfile. How is this?

Di Hei Over a year ago

For greenfield ios app, React dependency is referenced via HEADER_SEARCH_PATHS to your local node_modules/react-native path. For example, App Center AppCenterReactNativeAnalytics native module reference React in HEADER_SEARCH_PATHS = "$(SRCROOT)/../../react-native/React/**"; at this line. In other words, if React is not present in the Header Search Path, the native module won't find React and consequently throw an error.

Di Hei Over a year ago

@KonstantinKuznetsov, you should double check if react is properly referenced in the HEADER_SEARCH_PATHS of your native module.

Guillaume Perrot · Accepted Answer · 2017-12-12 19:19:35Z

1

As per the App Center SDK documentation for React Native, you have to run react-native link which will add the native dependencies for React Native for iOS.

The react-native version is actually defined in package.json at Javascript level and react-native link will install the corresponding native dependencies for that version.

Also when we make changes to the SDK, we use a test app to host the project so we can edit both test application and SDK code in the same XCode workspace.

edited Dec 12, 2017 at 19:19

answered Dec 12, 2017 at 19:13

Guillaume Perrot

4,3283 gold badges29 silver badges38 bronze badges

1 Comment

Konstantin Kuznetsov Over a year ago

Thank you. I think I understand what is going on during react-native link - prelink, postlink, inquirer asks your keys, Podile and AppDelegate are modified, pod install runs. As far as I get it, in RN0.51 all the native iOS dependencies of AppCenter (and as a react bridge it depends on React pod) are managed by Cocoapods. The part that I don't understand is that React pod is never mentioned in AppCenter podspecs. During build process AppCenter (or app using AppCenter) somehow satisfies AppCenter's dependency on native part of RN, but I'm unable to achieve same for my native module.

Collectives™ on Stack Overflow

React dependency in react-native module's podspec

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related