Error when linking: "Expected "/*", "//" or "{" but "<" found"

[jameshfisher]

Issue Description

When running react-native link, I get some kind of parse error. However, this parse error is impossible to debug, because it doesn't give me any filename, line number, or column number.

I was told to file an issue at https://github.com/rnpm/rnpm/issues but that directed me to file issues here instead.

Steps to Reproduce / Code Snippets

% react-native link
rnpm-install info Android module react-native-maps is already linked
rnpm-install ERR! It seems something went wrong while linking. Error: Expected "/*", "//" or "{" but "<" found.
Please file an issue here: https://github.com/rnpm/rnpm/issues

Expected "/*", "//" or "{" but "<" found.

Expected Results

No idea. I did it because these instructions tell me to.

Additional Information

• React Native version:

% react-native --version
react-native-cli: 1.0.0
react-native: 0.33.0

• Platform(s) (iOS, Android, or both?): Both
• Operating System (macOS, Linux, or Windows?): macOS

[nik]

+1, this is happening to me on every link no matter what library, same versions as OP.

[ethantran]

Had this issue today trying to react-native link/unlink/install/uninstall any library. I would get a message like this

.nvm/versions/node/v6.5.0/lib/node_modules/rnpm/node_modules/xcode/lib/parser/pbxproj.js:1835
      throw peg$buildException(null, peg$maxFailExpected, peg$maxFailPos);
      ^
SyntaxError: Expected "/*", "//" or "{" but "<" found.

npm uninstall rnpm -g fixed it.

[tarr11]

Seems like this is related to this: CocoaPods/CocoaPods#1275

My pbxproj gets converted to the new XML format after installing a pod, and the xcode node parser is expecting the old format.

[tarr11]

This solved it for me

CocoaPods/CocoaPods#1275 (comment)

[the-simian]

I'm also getting this problem, I checked out @tarr11 's fix, but I'm not 100% why it isn't working. If someone got this going, I know its a bit to ask, but can you post instructions on what to do?

[nik]

@the-simian , i kind of gave up on this a while ago, and just linked manually. its not that bad, once you get used to it, haha. i went here https://facebook.github.io/react-native/docs/linking-libraries-ios.html#manual-linking , and followed their steps and that worked for me (but i've only linked like a couple libraries)

[nebulr]

This really should not be closed. This has been an ongoing problem for some time.

[sospedra]

I cannot upgrade to 0.43 cause this issue :/

[hiddentao]

I had something similar too, I was getting:

$ react-native link react-native-code-push
? What is your CodePush deployment key for Android (hit <ENTER> to ignore) 
rnpm-install info Linking react-native-code-push android dependency 
rnpm-install info Android module react-native-code-push has been successfully linked 
rnpm-install ERR! It seems something went wrong while linking. Error: Expected "{" but "/" found. 
Please file an issue here: https://github.com/facebook/react-native/issues 

Expected "{" but "/" found.

Comparing with an older version of my code which worked, it looked like the problem was inside my iOS project.pbxproj file. The top line was:

 // !$*UTF8*$!
{

Removing the leading space fixed the problem for me:

// !$*UTF8*$!
{

[tybro0103]

Ran into this after react-native install react-native-fbsdk. Xcode then failed to open the project, and looking at the git diff I discovered my project.pbxproj file was written incorrectly like so:

HEADER_SEARCH_PATHS = "$(SRCROOT)/../node_modules/some-package""$(SRCROOT)/../node_modules/react-native-fbsdk/ios/RCTFBSDK/**";

All was well once I changed to format:

HEADER_SEARCH_PATHS = (
	"$(SRCROOT)/../node_modules/some-package",
	"$(SRCROOT)/../node_modules/react-native-fbsdk/ios/RCTFBSDK/**"
);

[alioguzhan]

@tybro0103 's solution worked for me. But note that there are many of HEADER_SEARCH_PATHS in *.pbxproj file. Find all and make sure all formatted well.

[ghost]

I have the exact same issue trying to link react-native-fbsdk and I've checked my *.pbxproj and it's all good.

[edencakir]

+1 same problem as Deevent's

[BATMAH69]

+1 same problem as Deevent's
I change
react-native install react-native-fbsdk
to
npm install react-native-fbsdk@0.6.0 --save
react-native link react-native-fbsdk

[edencakir]

@BATMAH69 ... and that worked?

[BATMAH69]

@edencakir Seems its work =)

[vinagrito]

@BATMAH69 @edencakir
I can confirm that it just worked for me 🎉 . Thx for the hint @BATMAH69

[BATMAH69]

@dzhuowen It seems the problem was somewhere in this commit.facebookarchive/react-native-fbsdk@a5bf87c

[Tawfeekamr]

Thanks! Worked for me @BATMAH69 ... but i won't to ask ... does FBSDK have problem ?! i try to do login with Facebook and that not work at all (with last react native )

Unable to resolve modules i face it every time i try a lot of tutorials !!

[BATMAH69]

@Tawfeekamr On Monday morning I set up a fb login for android. With version 0.6.0 there was a bug with java dependencies. After I fixed it with android everything was fine. Today I wanted to set up on iOs but because of this problem I did not have time. I'll set up tomorrow if everything works out. I will rely on this instruction and from react-native-fbsdk examples =)

Update:

npm install react-native-fbsdk@0.6.0 --save
react-native link react-native-fbsdk
npm install plist xcode adm-zip --save-dev
cp ./node_modules/react-native-fbsdk/ios_setup.js ./ios_setup.js
node ./ios_setup.js [App ID] [App Name]

add changes from this file
(don't forget change "HelloFacebook" to your app)

[ghost]

@BATMAH69 Thanks! It works for me :)

[Tawfeekamr]

@BATMAH69 Thanks dear that worked 💯 % when i created new project and do your tips! ...

For Github ppl there is more tips after BATMAH69 words:-

Then i have issue with LoginManager i fixed by do this:

export default class YourApp extends Component {

_YourFuncation {
LoginManager.logInWithReadPermissions(['public_profile']).then(
function(result) {
if (result.isCancelled) {
alert('Login was cancelled');
} else {
alert('Login was successful with permissions: '
+ result.grantedPermissions.toString());
}
},
function(error) {
alert('Login failed with error: ' + error);
}
);
}

And render code:

render() {
return (


Welcome to React Native!

<TouchableOpacity
onPress={() => this._YourFuncation}
>
Press Here


Press Cmd+R to reload,{'\n'}
Cmd+D or shake for dev menu


);
}
}

You must change YourApp to your react-native app name.

By following this tips: https://developers.facebook.com/docs/react-native/login

To download index.iOS.js files (code worked 100% ... so if any one have issue search about another thing) :
http://www.mediafire.com/file/tajh1izyx4j6b3v/index.ios.js

[danielediazmx]

Thanks a lot @BATMAH69 !

[Xabadu]

Thanks for the hint @BATMAH69. Worked for me as well. I unlinked and removed and then installed version 0.6.0 using Yarn and linked without any issues.

[harish-rw]

@BATMAH69 I have implemented same as you have provided solution here.

MainApplication.java And MainActivity.java is same as you have suggested in respective txt file.
And in build.gradle file have added following lines.

compile(project(':react-native-fbsdk')){
  exclude(group: 'com.facebook.android', module: 'facebook-android-sdk')
 }
 compile "com.facebook.android:facebook-android-sdk:4.22.1"

Even though I got this issue.

Full recompilation is required because 'FBSDKPackage.java' was changed. Analysis took 0.026 secs.
/var/www/html/mobileApp/node_modules/react-native-fbsdk/android/src/main/java/com/facebook/reactnative/androidsdk/FBSDKPackage.java:61: error: method does not override or implement a method from a supertype
    @Override
    ^
Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: /var/www/html/mobileApp/node_modules/react-native-fbsdk/android/src/main/java/com/facebook/reactnative/androidsdk/Utility.java uses unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.
1 error
:react-native-fbsdk:compileReleaseJavaWithJavac FAILED

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':react-native-fbsdk:compileReleaseJavaWithJavac'.
> Compilation failed; see the compiler error output for details.

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

BUILD FAILED

But when I comment @Override in the file node_modules/react-native-fbsdk/android/src/main/java/com/facebook/reactnative/androidsdk/FBSDKPackage.java at line 61 above createJSModules(). It installed the App in emulator. But App does not starts.

[BATMAH69]

@harish-rw I use solution first solution from https://stackoverflow.com/a/44191712

You can resolve this by Changing your node_modules\react-native-fbsdk\android\build.gradle from:
compile('com.facebook.android:facebook-android-sdk:4.+')
To:
compile('com.facebook.android:facebook-android-sdk:4.22.1')

Sorry, I didn't try another :)

But you can try this one https://stackoverflow.com/a/44205756 it force то sdk version

[harish-rw]

@BATMAH69 Thanks for taking your precious time to respond me.
I have already applied this solutions. But this has not worked.
Even I have downgraded react-native-fbsdk version to 0.5.0, I have tried react-native-fbsdk version 0.6.1, 0.6.0, 0.5.0. All of these has not worked.

Here are my changes.
In this file node_modules/react-native-fbsdk/android/build.gradle

apply plugin: 'com.android.library'

android {
    compileSdkVersion 23
    buildToolsVersion "23.0.1"

    defaultConfig {
        minSdkVersion 16
        targetSdkVersion 23
        versionCode 1
        versionName "1.0"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    testCompile 'junit:junit:4.12'
    compile 'com.android.support:appcompat-v7:23.1.0'
    compile 'com.facebook.react:react-native:+' // support react-native-v0.22-rc+
    compile('com.facebook.android:facebook-android-sdk:4.22.1')
}

In the file mobileApp/android/app/build.gradle

dependencies {
    compile project(':react-native-fbsdk')
    compile project(':react-native-push-notification')
    compile project(':react-native-image-crop-picker')
    compile project(':react-native-svg')
    compile project(':react-native-fetch-blob')
    compile project(':react-native-vector-icons')
    compile fileTree(dir: "libs", include: ["*.jar"])
    compile "com.android.support:appcompat-v7:23.0.1"
    compile "com.facebook.react:react-native:+"  // From node_modules
}

MainApplication.java

package com.mobileApp;
import android.app.Application;
import com.facebook.FacebookSdk;
import com.facebook.CallbackManager;
import com.facebook.appevents.AppEventsLogger;
import com.facebook.react.ReactApplication;
import com.facebook.reactnative.androidsdk.FBSDKPackage;
import com.dieam.reactnativepushnotification.ReactNativePushNotificationPackage;
import com.reactnative.ivpusic.imagepicker.PickerPackage;
import com.horcrux.svg.SvgPackage;
import com.RNFetchBlob.RNFetchBlobPackage;
import com.oblador.vectoricons.VectorIconsPackage;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;
import com.facebook.soloader.SoLoader;
import java.util.Arrays;
import java.util.List;

public class MainApplication extends Application implements ReactApplication {

  private static CallbackManager mCallbackManager = CallbackManager.Factory.create();

  public static CallbackManager getCallbackManager() {
    return mCallbackManager;
  }

  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
    @Override
    public boolean getUseDeveloperSupport() {
      return BuildConfig.DEBUG;
    }

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),            
            new FBSDKPackage(mCallbackManager),
            new ReactNativePushNotificationPackage(),
            new PickerPackage(),
            new SvgPackage(),
            new RNFetchBlobPackage(),
            new VectorIconsPackage()
      );
    }
  };

  @Override
  public ReactNativeHost getReactNativeHost() {
    return mReactNativeHost;
  }

  @Override
  public void onCreate() {
    super.onCreate();
    FacebookSdk.sdkInitialize(getApplicationContext());
    SoLoader.init(this, /* native exopackage */ false);
  }
}

MainActivity.java

package com.mobileApp;
import com.facebook.react.ReactActivity;
import android.content.Intent;

public class MainActivity extends ReactActivity {

    /**
     * Returns the name of the main component registered from JavaScript.
     * This is used to schedule rendering of the component.
     */
    @Override
    protected String getMainComponentName() {
        return "mobileApp";
    }

    @Override
    public void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        MainApplication.getCallbackManager().onActivityResult(requestCode, resultCode, data);
    }
}

Please guide how can I resolve this.

[BATMAH69]

I use 0.6.0 version. I not very good in native code, can only show mine =)

In this file node_modules/react-native-fbsdk/android/build.gradle

apply plugin: 'com.android.library'

android {
    compileSdkVersion 23
    buildToolsVersion "23.0.1"

    defaultConfig {
        minSdkVersion 16
        targetSdkVersion 23
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile 'com.android.support:appcompat-v7:23.0.1'
    compile 'com.facebook.react:react-native:+' // support react-native-v0.22-rc+
    compile('com.facebook.android:facebook-android-sdk:4.22.1')
}

dependencies {
    compile project(':react-native-testfairy')
    compile project(':react-native-fetch-blob')
    compile project(':react-native-camera')
    compile project(':react-native-fbsdk')
    compile fileTree(dir: "libs", include: ["*.jar"])
    compile "com.android.support:appcompat-v7:23.0.1"
    compile "com.facebook.react:react-native:+"  // From node_modules
}

MainApplication.java & MainActivity.java are same as in my comment higher.

[fabriziomoscon]

I am using RN 0.47.2 and I have followed successfully this suggestion: #10032 (comment)

• open the mentioned file with Xcode
• open Build settings
• change any items
• revert it to what it was (for example set a Yes to No then back to Yes)

now you can run react-native link react-native-fbsdk without errors

[piemonkey]

This was reliably working for me on one system and not on another, so managed to narrow this down to being an encoding issue. We were able to confirm this using a freshly init'ed project using the latest cli (2.0.1).

A successful workaround for me is to explicitly unset the LANG environment variable when running link or install (install is a wrapper around npm install/yarn add and link):

LANG= react-native link react-native-fbsdk

Does this work for anyone else?

[gjerris]

@piemonkey
Thank you - worked great and fixed the problem!!!!

[ArmandoAssuncao]

while we await the merge of fbsdk, the problem can be bypassed with manual installation:

yarn add https://github.com/facebook/react-native-fbsdk.git#47b906a

Android already works

For IOS, is necessary manual installation

tested in RN 0.48.4

[piemonkey]

@ArmandoAssuncao Using that commit hash didn't make any difference to me, I still have the same problem. Admittedly I'm on RN 0.47.2, but I don't know if that makes a difference as I tested previously with a fresh 0.48.x project. What's your LANG environment variable set to? Mine is en_GB.UTF-8.

[ArmandoAssuncao]

@piemonkey the problem can be bypassed with manual installation, but not fixed. I wrote wrong, sorry.
Btw, my LANG is en_US.UTF-8.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. If you think this issue should definitely remain open, please let us know why. Thank you for your contributions.

[piemonkey]

I've just tested this on a new project (react-native-cli 2.0.1, react-native 0.50.4, react-native-fbsdk 0.6.3) and it seems to work, so I guess this could be marked as closed.

[victorbadila]

@piemonkey both ios and android?

[piemonkey]

As far as I know this bug was only on iOS, that's the only place I saw the results the OP reported and I don't think there are any comments which contradict me. I believe the problems mentioning Android above are related to a different bug which I reported on their private bug tracker and got pseudo-ignored. I'm going to check if that's still an issue and try to re-open if it is. If that report accurately describes your symptoms, I'd suggest pushing for fixes over there.

[EvanGeminika]

A work around that take to solve this issue is like below:

1. take a backup of android & ios directory
2. delete android & ios directory
3. in project folder execute "react-native eject" which will create android & ios directory.
4. just in case you have some custom setting you can take it from the backup in step 1.

[piemonkey]

@VanMen I haven't tested your fix because I beleive it's fixed with the latest releases. Given that it used to occur with a fresh project with no changes to the android or ios code I'd be surprised if that workaround made any difference.

I'd be interested if anyone is still seeing this or if it can be marked as closed.

[notgiorgi]

For me the problem was that, react native link was generating this:

HEADER_SEARCH_PATHS = "$(SRCROOT)/..""$(SRCROOT)/../node_modules/appcenter/ios/AppCenterReactNative";

instead of this:

HEADER_SEARCH_PATHS = (
  "$(SRCROOT)/..",
  "$(SRCROOT)/../node_modules/appcenter/ios/AppCenterReactNative",
);

so I think the problem is in this file: react-native/local-cli/link/ios/addToHeaderSearchPaths.js

[AbdelhalimAhmed]

this case if you use "yarn"
you need just run npm install then react-native link working with me

[stale]

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 "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

[stale]

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.