React Native: Podfiles causing name collusions

Question

I am getting an error:

Ambiguous resolution: module ".../myModule.js" tries to require 'react-native', but there are several files providing this module. You can delete or fix them:

.../MyProject/ios/Pods/React/package.json

.../MyProject/node_modules/react-native/package.json

I am almost certain that this is due to using Podfiles, specifically, when they install the "React" folder. However, I had to use Podfiles in order to install react-native-firebase. With that said, when I delete the React folder under my Pods folder (ios/Pods/React), I can no longer use react-native-firebase.

There was a fix floating around GitHub, which suggested appending the Podfile with:

post_install do |installer|
  installer.pods_project.targets.each do |target|
    if target.name == "React"
      target.remove_from_project
    end
  end
end

But this did not work for me. Has anyone encountered this problem before?

If it is relevant, this is the podfile that I am using:

platform :ios, '8.0'

target 'MyProject2' do
    pod 'Firebase/Core'
    pod 'Firebase/Database'
    pod 'Firebase/Messaging'

  pod 'RNSVG', :path => '../node_modules/react-native-svg'

  target 'MyProject2Tests' do
    inherit! :search_paths
    # Pods for testing
  end

  post_install do |installer|
    installer.pods_project.targets.each do |target|
      if target.name == "React"
        target.remove_from_project
      end
    end
  end

end

EDIT: When I remove the 'RNSVG' from my Podfile, I get an error stating: "Invariant Violation: Native component for 'RNSVGPath' does not exist". I have both ran react-native link and followed the instructions for manual installation for react-native-svg.

score 1 · Answer 1 · answered Sep 12 '18 at 22:32

1

I had to manually link the React pod to node_modules:

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

answered Sep 12 '18 at 22:32

Chris Feist

1,678
15
17

Brilliant, but I found I also needed to add a subspecs section! – deworde Oct 12 '18 at 09:03

score 0 · Answer 2 · edited Jan 17 '19 at 10:10

I just finished managing this problem when making my app work for iOS.

I used Chris' solution and also...

The haste packaging manager was finding instances of my modules both from my root node_modules folder and from the node_modules folder inside my Build folder.

To solve that, create a file called rn-cli.config.js in the root of your project:

const blacklist = require('metro-config/src/defaults/blacklist');


module.exports = {
resolver: {
blacklistRE: blacklist([
                        /Build\/.*/,
                        ])
},
};

score 0 · Answer 3 · answered Aug 09 '19 at 14:55

This problem seems to happen anytime a Pod is added with a React dependency.

Once something has a react dependency and the React Pod is not added, it will often attempt to install it, finding an old version of React on CocoaPods (0.11).

To avoid this, you need to add the dependency and required subdependencies explicitly, per the documentation for react-native here: react-native cocoapods docs.

For instance, when I added the react-native-community/async-storage module, I had to add all of this to my podfile which previously had only AppCenter and Firebase related dependencies:

  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
    'RCTAnimation', # Needed for FlatList and animations running on native UI thread
# 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'
  pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
  pod 'RNCAsyncStorage', :path => '../node_modules/@react-native-community/async-storage'

score -1 · Answer 4 · answered Mar 22 '18 at 06:55

-1

Taking a look at react-native-svg, their Podfile specifies React as a dependency. To keep things simple, I would suggest that you use the recommended react-native link command to install this library rather than specifying it within the Podfile.

Once you've removed react-native-svg you will probably want to clear down your Podfile folder and re-run pod install

answered Mar 22 '18 at 06:55

Chris

217
1
2
10

When I do that, I get a "Invariant Violation: Native component for 'RNSVGPath' does not exist". Even though, I have both ran 'react-native link' and followed the steps for manual installation of react-native-svg. – user8951490 Mar 22 '18 at 07:55
From my observations, react-native link adds the library to the Podfile, so this should produce the same effect. – deworde Oct 10 '18 at 09:44

React Native: Podfiles causing name collusions

4 Answers4