Thanh-Quy Nguyen
Thanh-Quy Nguyen

Reputation: 3265

Setting Fbsdk frameworks for an iOS React-Native project

[Huge update]
Someone sent me this and it is much easier to read in order to install fbsdk with React Native: https://developers.facebook.com/docs/react-native/getting-started-ios
However, the problem was still the same:

Use of undeclared identifier 'UIUserInterfaceIdiomTV'

I guess this is an error coming from the content pulled by CocoaPods, because I was able to make the sample example work by simply deleting the same UIUserInterfaceIdiomTV case (it used to be in a switch).

However, by following every step from the guide and eventually deleting the UIUserInterfaceIdiomTV, I am faced with new compilation problems in my own project:
Undefined symbols for architecture x86_64: "_OBJC_CLASS_$_FBSDKAppEvents", referenced from: objc-class-ref in AppDelegate.o "_OBJC_CLASS_$_FBSDKApplicationDelegate", referenced from: objc-class-ref in AppDelegate.o "_OBJC_CLASS_$_RCTRootView", referenced from: objc-class-ref in AppDelegate.o ld: symbol(s) not found for architecture x86_64 clang: error: linker command failed with exit code 1 (use -v to see invocation)

If anyone can help...
Thanks for your help!

Upvotes: 1

Views: 1976

Answers (2)

Chris Geirman
Chris Geirman

Reputation: 9684

This article answers your question directly... https://colinramsay.co.uk/2016/04/29/go-serverless.html

I'll copy/paste the relevant details because I know a link isn't a decent answer on SOF.

Let’s install the Facebook React Native SDK via npm, that’ll give us a nice login button for free:

npm install --save react-native-fbsdkcore react-native-fbsdklogin

We need to install some native code to make this work, so let’s do that with CocoaPods. First we create a Podfile:

cd ios
pod init

Edit the file which was just created at FacebookAwsReactNative/ios/Podfile and add the following:

source 'https://github.com/CocoaPods/Specs.git'
pod 'React', :subspecs => ['Core', 'RCTImage', 'RCTNetwork', 'RCTText', 'RCTWebSocket'], :path => '../node_modules/react-native'
pod 'react-native-fbsdkcore', :path => '../node_modules/react-native-fbsdkcore'
pod 'react-native-fbsdklogin', :path => '../node_modules/react-native-fbsdklogin'
pod 'react-native-fbsdkshare', :path => '../node_modules/react-native-fbsdkshare'

You may need to perform some other steps here, as per the Facebook documentation. Go and have a read of that section just in case. Let’s install the pods and then we’ll have to faff around in Xcode for a bit.

pod install
open FacebookAwsReactNative.xcworkspace

Notice that we now use the xcworkspace file rather than the xcodeproj file; this is required for CocoaPods to do its thing.

Expand the FacebookAwsReactNative > Libraries folder and select all of the items in there and delete the references to them. This is because we’ve opted to use CocoaPods for React Native (see the pod 'React' line we added to the Podfile) so the items in Libraries are duplicates.

Upvotes: 1

Thanh-Quy Nguyen
Thanh-Quy Nguyen

Reputation: 3265

I finally made the fbsdk to work (24/04/2016). To sum up the different steps in case you meet the same problem:

  • If you meet the The 'YourApp [Debug]' target overrides the 'OTHER_LDFLAGS' build setting... warning after the command pod install, the $(inherited) is to be added in the main project build settings and not in the Pods
  • UIUserInterfaceIdiomTV isn't recognized for now for an unknown reason, so in AppDelegate.m, if you get an error, just skim the case from the switch
  • The info.plist must include a few lines that are not (yet) mentioned in the sdk installation guide. Here's the complete list of what you should add: <key>CFBundleURLTypes</key> <array> <dict> <key>CFBundleURLSchemes</key> <array> <string>fb{your-app-id}</string> </array> </dict> </array> <key>LSApplicationQueriesSchemes</key> <array> <string>fbapi</string> <string>fb-messenger-api</string> <string>fbauth2</string> <string>fbshareextension</string> </array> <key>FacebookAppID</key> <string>{your-app-id}</string> <key>FacebookDisplayName</key> <string>{your-app-name}</string>

Do not forget to replace {your-app-id} by... your app id, and {your-app-name} by your app name. Good luck to everyone!

Upvotes: 1

Related Questions