I am getting an error when trying to use react-native-fbsdk. I assume its some issue with the SDK installation process but I am not sure.

Installation appears to go without error but when trying to use the SDK I am getting this error:

undefined is not an object (evaluating

'LoginManager.logInWithReadPermissions')

Code that is using the SDK:

try {

  var result = await LoginManager.logInWithReadPermissions(["public_profile"]);

  if (result && result.isCancelled) {

    console.log("Login cancelled");

  } else {

    console.log(

      "Login success with permissions: " +

      result.grantedPermissions.toString()

    );

  }

} catch (e) {

  console.error(e.message);

}

Installation instructions:

npm install react-native-fbsdk

react-native link react-native-fbsdk

cd ios

pod init

// Add "pod 'FacebookSDK'" to pod file

pod install

// Configure Info.plist and AppDelegate.m

The first 2 commands are specified here: https://github.com/facebook/react-native-fbsdk
The rest of the process is specified here: https://developers.facebook.com/docs/ios/getting-started/#settings

Does anyone have any idea what might be going wrong?

Thanks

Environment:

- macOs High Sierra

- XCode (10.1)

- FacebookSDK (4.38.0)

- react (16.6.1)

- react-native (0.57.5)

- react-native-fbsdk (0.8.0)

There is another unresolved question from someone who appears to have the same problem but he did not specify his installation process or package versions.
Facebook SDK react LoginManager.logInWithReadPermissions undefined is not an object

Here is my install procedure. it's work.

1. Install react-native-fbsdk

react-native install react-native-fbsdk

2. Install SDK

Add following lines to ios/PodFile and execute pod install

pod 'FBSDKLoginKit'

pod 'FBSDKShareKit'

If no FBSDKShareKit will build failed with: fatal error: 'FBSDKShareKit/FBSDKShareKit.h' file not found

3. Set Info.plist

Add following lines to ios/Project Name/Info.plist (According to https://developers.facebook.com/docs/ios/getting-started/)

<key>CFBundleURLTypes</key>

<array>

    <dict>

        <key>CFBundleURLSchemes</key> 

        <array> 

            <string>fb369704160457623</string> 

        </array> 

    </dict>

</array> 

<key>FacebookAppID</key> 

<string>Your facebook app id</string>

<key>FacebookDisplayName</key> 

<string>Your app name</string>

<key>LSApplicationQueriesSchemes</key>

<array>

  <string>fbapi</string>

  <string>fb-messenger-share-api</string>

  <string>fbauth2</string>

  <string>fbshareextension</string>

</array>

Replace FacebookAppID, FacebookDisplayName key values to you actually use.

4. Modify AppDelegate.m

According to https://developers.facebook.com/docs/ios/getting-started/.

//  AppDelegate.m

#import <FBSDKCoreKit/FBSDKCoreKit.h> // Add this line



- (BOOL)application:(UIApplication *)application 

    didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {



  [[FBSDKApplicationDelegate sharedInstance] application:application

    didFinishLaunchingWithOptions:launchOptions]; // Add this line

  // Add any custom logic here.

  return YES;

}



// Add following lines

- (BOOL)application:(UIApplication *)application 

            openURL:(NSURL *)url 

            options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {



  BOOL handled = [[FBSDKApplicationDelegate sharedInstance] application:application

    openURL:url

    sourceApplication:options[UIApplicationOpenURLOptionsSourceApplicationKey]

    annotation:options[UIApplicationOpenURLOptionsAnnotationKey]

  ];

  // Add any custom logic here.

  return handled;

}

5. Modify App.js

1. Import LoginManager at header.


2. Add login() function to call LoginManger.logInWithReadPermissions().


3. Add component to at render().

App.js as following

/**

 * Sample React Native App

 * https://github.com/facebook/react-native

 *

 * @format

 * @flow

 */



import React, { Component } from 'react';

import { Platform, StyleSheet, Text, View, TouchableOpacity } from 'react-native';

import { LoginManager } from "react-native-fbsdk";



const instructions = Platform.select({

  ios: 'Press Cmd+R to reload,n' + 'Cmd+D or shake for dev menu',

  android:

    'Double tap R on your keyboard to reload,n' +

    'Shake or press menu button for dev menu',

});



type Props = {};

export default class App extends Component<Props> {

  login() {

    LoginManager.logInWithReadPermissions(["public_profile"]).then(

      function (result) {

        if (result.isCancelled) {

          console.log("Login cancelled");

        } else {

          console.log(

            "Login success with permissions: " +

            result.grantedPermissions.toString()

          );

        }

      },

      function (error) {

        console.log("Login fail with error: " + error);

      }

    );

  }

  render() {

    return (

      <View style={styles.container}>

        <Text style={styles.welcome}>Welcome to React Native!</Text>

        <Text style={styles.instructions}>To get started, edit App.js</Text>

        <Text style={styles.instructions}>{instructions}</Text>

        <TouchableOpacity onPress={this.login.bind(this)}>

          <Text>FBLogin</Text>

        </TouchableOpacity>

      </View>

    );

  }

}



const styles = StyleSheet.create({

  container: {

    flex: 1,

    justifyContent: 'center',

    alignItems: 'center',

    backgroundColor: '#F5FCFF',

  },

  welcome: {

    fontSize: 20,

    textAlign: 'center',

    margin: 10,

  },

  instructions: {

    textAlign: 'center',

    color: '#333333',

    marginBottom: 5,

  },

});

6. Run

react-native run-ios

7. My environment:

  React Native Environment Info:

    Binaries:

      Node: 11.2.0 - /usr/local/bin/node

      Yarn: 1.12.3 - /usr/local/bin/yarn

      npm: 6.4.1 - /usr/local/bin/npm

      Watchman: 4.9.0 - /usr/local/bin/watchman

    SDKs:

      iOS SDK:

        Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1

      Android SDK:

        API Levels: 23, 24, 25, 26, 27, 28

        Build Tools: 23.0.1, 23.0.3, 24.0.1, 25.0.0, 26.0.1, 26.0.2, 26.0.3, 27.0.1, 27.0.3, 28.0.2, 28.0.3

        System Images: android-23 | Intel x86 Atom_64, android-23 | Google APIs Intel x86 Atom_64, android-28 | Google Play Intel x86 Atom

    IDEs:

      Android Studio: 3.2 AI-181.5540.7.32.5056338

      Xcode: 10.1/10B61 - /usr/bin/xcodebuild

    npmPackages:

      react: 16.6.1 => 16.6.1

      react-native: 0.57.7 => 0.57.7

    npmGlobalPackages:

      react-native-cli: 2.0.1

      react-native-git-upgrade: 0.2.7

      react-native-rename: 2.3.2