正确地将fbsdk集成在react-native中

Question

Its been 2 days I have been trying to incorporate react-native-fbsdk into my react-native project; but have had no luck. Have gone through and followed most of the tutorials on the internet(including those provided by Facebook: https://developers.facebook.com/quickstarts/ ) , but nothing seems to work. Best I have got is a rectangle with red border(which should have been "Login With Facebook")

I have started just 2 days ago so everything I am working on is up-to-date. I have also installed 'rnpm' for linking module to native apps.

Here is the package.json:

    {
      "name": "bas",
      "version": "0.0.1",
      "private": true,
      "scripts": {
        "start": "node node_modules/react-native/local-cli/cli.js start",
        "test": "jest"
      },
      "dependencies": {
        "react": "~15.4.0-rc.4",
        "react-native": "0.40.0",
        "react-native-fbsdk": "^0.4.0"
      },
      "devDependencies": {
        "babel-jest": "18.0.0",
        "babel-preset-react-native": "1.9.1",
        "jest": "18.1.0",
        "react-test-renderer": "~15.4.0-rc.4"
      },
      "jest": {
        "preset": "react-native"
      }
    }

Sorry if I seem dumb anywhere; have just started mobile app development; I come from web development background.

Thanks in advance!

Answer 1

I cannot take credit for this answer - but after some digging it appears that the issue was introduced in react-native v0.40.0 . Unfortunately many libraries are not yet updated to work with these changes.

Lucky for us, react-native-fbsdk does support it, but it unfortunately it hasn't been formally released yet.

You can use the latest version (with the fix) by directly from github. Follow the steps here: https://github.com/facebook/react-native-fbsdk/pull/322#issuecomment-271457311

This worked for me! Good luck.