Not working with React Native 0.60

[BenJeau]

I've created a new React Native app with the latest version (0.60), and installed this module with the steps in the README, but since it introduced autolinking (https://github.com/react-native-community/cli/blob/master/docs/autolinking.md), when compiling, it just gives some errors, even when I was linking it manually (aka the way described in the README).

/home/ben/code/spoti-find/test/android/app/build/generated/rncli/src/main/java/com/facebook/react/PackageList.java:19: error: cannot find symbol
import com.spotify.sdk.android.authentication.RNSpotifyPackage;
                                             ^
  symbol:   class RNSpotifyPackage
  location: package com.spotify.sdk.android.authentication
/home/ben/code/spoti-find/test/android/app/build/generated/rncli/src/main/java/com/facebook/react/PackageList.java:54: error: cannot find symbol
      new RNSpotifyPackage()
          ^
  symbol:   class RNSpotifyPackage
  location: class PackageList
2 errors

I know this error is related to the import of the wrong code, since it still tries to autolink it if I manually linked it.

It may also have to do with AndroidX support, since that was also introduced. The jetifier could be used, if its related to AndroidX, https://github.com/mikehardy/jetifier.

By making this module compatible with React Native 0.60 #135, #138, and #137 would be fixed with the autolinking (I think).

Or if anyone is able to make it work with React Native 0.60, please let me know :)

[askielboe]

Autolinking is not supported by react-native-spotify yet; you need to link manually, with some specifics related to RN 0.60.

After much trial and error I arrived at this which seems to work (your mileage may vary):

build.gradle:

allprojects {
    repositories {
...
        flatDir {
            // Manually linked packages
            dirs project(":rn-spotify-sdk").file("libs"), "libs"
        }

app/build.gradle:

dependencies {
...
    implementation project(":rn-spotify-sdk")

settings.gradle:

include ":rn-spotify-sdk"
project(":rn-spotify-sdk").projectDir = new File(rootProject.projectDir, "../node_modules/rn-spotify-sdk/android")

MainApplication.java:

import com.lufinkey.react.spotify.RNSpotifyPackage;
...
protected List<ReactPackage> getPackages() {
...
    // Packages that cannot be autolinked yet can be added manually here, for example:
    packages.add(new RNSpotifyPackage());

react-native.config.js:

// Autolinking does not work in rn-spotify yet, so we disable it on Android
// see: https://github.com/lufinkey/react-native-spotify/issues/135
module.exports = {
    dependencies: {
        "rn-spotify-sdk": {
            platforms: {
                android: null, // disable Android platform, other platforms will still autolink if provided
            },
        },
    },
};

[BenJeau]

Yeah, changing those files makes it work on 0.60 in my project, thanks!

[davidlevy]

I had the same issue but after fixing that, now I get another one :

Could not find module with name RNEventEmitter

any idea ?

[askielboe]

Could not find module with name RNEventEmitter

This should be installed as a dependency by cocoapods. Try updating cocoapods, deleting your Pods folder and run pod install again.

If that doesn't help you can try adding pod 'RNEventEmitter', :path => '../node_modules/react-native-events' to your Podfile, but it really shouldn't be necessary.

[davidlevy]

I forgot to mention it was for Android, but thanks @askielboe

I just fixed the issue, packages.add(new RNEventEmitterPackage()); was missing in MainApplication.java :

@Override
protected List<ReactPackage> getPackages() {
  @SuppressWarnings("UnnecessaryLocalVariable")
  List<ReactPackage> packages = new PackageList(this).getPackages();
  // Packages that cannot be autolinked yet can be added manually here, for example:
  // packages.add(new MyReactNativePackage());

  packages.add(new RNSpotifyPackage());
  packages.add(new RNEventEmitterPackage());


  return packages;
}

Not sure if it's because of the link issues with RN 0.60 or because of me having tried to link auto/manually several times, but worth sharing !

[askielboe]

Ah! Sorry. :D Well I don't have it in my MainApplication.java it really should link it automatically. But if it works for you. 🤷🏼‍♂️

[ririvas]

These instructions worked for me, but I had to repeat the instructions for the react-native-events package.

[grabbou]

I am going to look into fixing this right now. Meanwhile, please use this workaround to make it compatible with "autolinking":

react-native-community/cli#714 (comment)

Meanwhile, note that this package can also create react-native.config.js under its root, ship it with the package and overwrite packageName so that users don't need to do it themselves.

The following file would do:

module.exports = {
  dependency: {
     platforms: {
       android: {
         packageImportPath: 'com.lufinkey.react.spotify.RNSpotifyPackage'
       }
     }
  }
}

I am going to check why this is even needed.

[grabbou]

I am sending a PR to this library to fix it. The error is because of external/SpotifySDK added to the project, that ships with its own AndroidManifest.xml file and tricks CLI to using that one instead.