search

facebook / react-native

A framework for building native applications using React
https://reactnative.dev
MIT License
117.18k stars 24.09k forks source link

Unable to integrate React Native with an iOS app that already uses YogaKit pod #24379

Closed sflahave closed 4 years ago

sflahave commented 5 years ago

🐛 Bug Report

Users are unable to integrate React Native into a native iOS app that already uses the YogaKit CocoaPod.

To Reproduce

Setup a new iOS app. Set it up with Cocoapods in the usual way, and add YogaKit as a pod dependency (i.e., add pod 'YogaKit' to your Podfile). Run pod install. Then, follow the iOS/Swift instructions at https://facebook.github.io/react-native/docs/integration-with-existing-apps Specifically, notice that you are directed to add the following line to your Podfile: 

 # Explicitly include Yoga if you are using RN >= 0.42.0
  pod "yoga", :path => "../node_modules/react-native/ReactCommon/yoga"

After you do that, run pod install again. Cocoapods won't complain. But now, try running your project in XCode 10.2 (the latest as of Apr 9, 2019). You should see a bunch of errors like 

:-1: Multiple commands produce '<blahblahblah>/Build/Products/Mobile-iphonesimulator/yoga/yoga.framework/Headers/Yoga.h':

You could try going to File -> Workspace Settings, and then switching the Build System from "New Build System (Default)" to "Legacy Build System". But that will just result in a bunch of different errors. I was able to get around this by digging into the node_modules/react-native/ReactCommon/yoga and adjusting the yoga.podspec by renaming that "pod" to something like "RCTYoga". So - I'm proposing that this be done in React Native, since the "yoga" library that React Native is using is apparently not interchangeable with the real Yoga library at https://github.com/facebook/yoga/

Expected Behavior

Users should be able to integrate React Native even if they're already using Yoga.

Code Example

Set up a new iOS app with CocoaPods, and use the following Podfile: 

source 'https://github.com/CocoaPods/Specs.git'

# Required for Swift apps
platform :ios, '12.0'
use_frameworks!

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

  pod 'YogaKit'

  # 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',
    '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
    # 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

Environment

  React Native Environment Info:
    System:
      OS: macOS 10.14.4
      CPU: (8) x64 Intel(R) Core(TM) i7-4870HQ CPU @ 2.50GHz
      Memory: 1.91 GB / 16.00 GB
      Shell: 5.3 - /bin/zsh
    Binaries:
      Node: 10.15.1 - /usr/local/bin/node
      Yarn: 1.13.0 - /usr/local/bin/yarn
      npm: 6.9.0 - /usr/local/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
      Android SDK:
        API Levels: 23, 25, 26, 27
        Build Tools: 23.0.1, 25.0.2, 25.0.3, 26.0.0, 26.0.1, 26.0.2, 27.0.1, 27.0.2, 28.0.3
        System Images: android-23 | Intel x86 Atom_64, android-23 | Google APIs Intel x86 Atom, android-23 | Google APIs Intel x86 Atom_64, android-25 | Google APIs Intel x86 Atom, android-25 | Google APIs Intel x86 Atom_64, android-26 | Google APIs Intel x86 Atom, android-26 | Google Play Intel x86 Atom, android-27 | Google APIs Intel x86 Atom
    IDEs:
      Android Studio: 3.3 AI-182.5107.16.33.5314842
      Xcode: 10.2/10E125 - /usr/bin/xcodebuild
    npmPackages:
      react-native: ^0.59.4 => 0.59.4
    npmGlobalPackages:
      create-react-native-app: 1.0.0
      react-native-cli: 2.0.1
      react-native: 0.51.0
sflahave commented 5 years ago

Note - I was able to work around this by creating a fork of the Yoga library, and then just renaming all the seemingly important things to hopefully avoid naming collisions with the version of Yoga that React Native uses. It seems to work. Here's my fork, if anyone is interested: https://github.com/sflahave/yoga We're currently using Yoga/YogaKit 1.9.0.

yayanet commented 5 years ago

Note - I was able to work around this by creating a fork of the Yoga library, and then just renaming all the seemingly important things to hopefully avoid naming collisions with the version of Yoga that React Native uses. It seems to work. Here's my fork, if anyone is interested: https://github.com/sflahave/yoga We're currently using Yoga/YogaKit 1.9.0.

It doesn't work for me, i can't create issue in project https://github.com/sflahave/yoga these variables below should be rename too? thx @sflahave

Error:

duplicate symbol _gCurrentGenerationCount in:
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/BindYoga/libBindYoga.a(BindYoga.o)
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/yoga/libyoga.a(Yoga.o)
duplicate symbol _gConfigInstanceCount in:
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/BindYoga/libBindYoga.a(BindYoga.o)
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/yoga/libyoga.a(Yoga.o)
duplicate symbol _gNodeInstanceCount in:
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/BindYoga/libBindYoga.a(BindYoga.o)
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/yoga/libyoga.a(Yoga.o)
duplicate symbol _gPrintSkips in:
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/BindYoga/libBindYoga.a(BindYoga.o)
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/yoga/libyoga.a(Yoga.o)
duplicate symbol _gPrintChanges in:
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/BindYoga/libBindYoga.a(BindYoga.o)
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/yoga/libyoga.a(Yoga.o)
duplicate symbol _gDepth in:
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/BindYoga/libBindYoga.a(BindYoga.o)
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/yoga/libyoga.a(Yoga.o)
duplicate symbol _trailing in:
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/BindYoga/libBindYoga.a(BindYoga.o)
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/yoga/libyoga.a(Yoga.o)
duplicate symbol _leading in:
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/BindYoga/libBindYoga.a(BindYoga.o)
    /Users/yuyang/Library/Developer/Xcode/DerivedData/NextCode-fzfptzjxbmlwklfzggslfwwivddb/Build/Products/Debug-iphonesimulator/yoga/libyoga.a(Yoga.o)
ld: 8 duplicate symbols for architecture x86_64
clang: error: linker command failed with exit code 1 (use -v to see invocation)

Podfile:

pod 'BindYoga', :git => 'https://github.com/sflahave/yoga.git', :tag => 'bind-yoga-1.9.0'
pod 'BindYogaKit', :git => 'https://github.com/sflahave/yoga.git', :tag => 'bind-yoga-1.9.0'
yayanet commented 5 years ago

I found another way to solve this problem

  1. Remove YogaKit from Podfile
  2. Find the right version yoga in your react-native: I'm using react-native 0.59.9, and the core file https://github.com/facebook/react-native/blob/v0.59.9/ReactCommon/yoga/yoga/Yoga.cpp updated at 1 Feb so i find the latest version of yoga before 1Feb in https://github.com/facebook/yoga/releases ,it's v1.10.0 released on 6 Oct 2018 ·
  3. download yoga code and put YogaKit/Source/* into your project directly
stale[bot] commented 4 years ago

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.

stale[bot] commented 4 years ago

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.