Android build fails with following error: package tech.bam.rnperformance.flipper does not exist

[DavydVeremchuk]

Active:

After the installation the app fails during a build process with following error:
package tech.bam.rnperformance.flipper does not exist

react: ^16.8.3,
react-native: 0.67.2,
node: v16.5.0
yarn: 1.22.15
flipper: 0.140.0

ReactNativeFlipper.java:

package.json:

node_modules:

Expected:

To be able to run the app after plugin installation and debug it in Flipper

[Alexandre Moureaux]

Hi @DavydVeremchuk, thanks for posting an issue!

That's weird, it looks like RN auto linking has failed for some reason, does it usually work?

What do you have inside android/app/build/generated/rncli/src/main/java/com/facebook/react/PackageList.java for instance? (this file should be auto-generated when you build by RN auto linking)

[DavydVeremchuk]

Hi @DavydVeremchuk, thanks for posting an issue!

That's weird, it looks like RN auto linking has failed for some reason, does it usually work?

What do you have inside android/app/build/generated/rncli/src/main/java/com/facebook/react/PackageList.java for instance? (this file should be auto-generated when you build by RN auto linking)

I've just tried to reinstall it with following steps:

yarn remove <name> + yarn add <name> + nx run-android <appName>

It recreated PackageList.java and here's its content:

package com.facebook.react;

import android.app.Application;
import android.content.Context;
import android.content.res.Resources;

import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainPackageConfig;
import com.facebook.react.shell.MainReactPackage;
import java.util.Arrays;
import java.util.ArrayList;

// react-native-config
import com.lugg.ReactNativeConfig.ReactNativeConfigPackage;
// react-native-svg
import com.horcrux.svg.SvgPackage;
// react-native-background-job
import com.pilloxa.backgroundjob.BackgroundJobPackage;
// @react-native-mapbox-gl/maps
import com.mapbox.rctmgl.RCTMGLPackage;
// react-native-sensors
import com.sensors.RNSensorsPackage;
// react-native-geolocation-service
import com.agontuk.RNFusedLocation.RNFusedLocationPackage;
// react-native-gesture-handler
import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;
// react-native-incall-manager
import com.zxcpoiu.incallmanager.InCallManagerPackage;
// react-native-linear-gradient
import com.BV.LinearGradient.LinearGradientPackage;
// react-native-localize
import com.reactcommunity.rnlocalize.RNLocalizePackage;
// react-native-screens
import com.swmansion.rnscreens.RNScreensPackage;
// react-native-snackbar
import com.azendoo.reactnativesnackbar.SnackbarPackage;
// react-native-spinkit
import com.react.rnspinkit.RNSpinkitPackage;
// react-native-tts
import net.no_mad.tts.TextToSpeechPackage;
// react-native-vector-icons
import com.oblador.vectoricons.VectorIconsPackage;
// react-native-webrtc
import com.oney.WebRTCModule.WebRTCModulePackage;
// react-native-yz-vlcplayer
import com.yuanzhou.vlc.ReactVlcPlayerPackage;
// @react-native-community/netinfo
import com.reactnativecommunity.netinfo.NetInfoPackage;
// @supersami/rn-foreground-service
import com.supersami.foregroundservice.ForegroundServicePackage;
// @react-native-async-storage/async-storage
import com.reactnativecommunity.asyncstorage.AsyncStoragePackage;

public class PackageList {
  private Application application;
  private ReactNativeHost reactNativeHost;
  private MainPackageConfig mConfig;

  public PackageList(ReactNativeHost reactNativeHost) {
    this(reactNativeHost, null);
  }

  public PackageList(Application application) {
    this(application, null);
  }

  public PackageList(ReactNativeHost reactNativeHost, MainPackageConfig config) {
    this.reactNativeHost = reactNativeHost;
    mConfig = config;
  }

  public PackageList(Application application, MainPackageConfig config) {
    this.reactNativeHost = null;
    this.application = application;
    mConfig = config;
  }

  private ReactNativeHost getReactNativeHost() {
    return this.reactNativeHost;
  }

  private Resources getResources() {
    return this.getApplication().getResources();
  }

  private Application getApplication() {
    if (this.reactNativeHost == null) return this.application;
    return this.reactNativeHost.getApplication();
  }

  private Context getApplicationContext() {
    return this.getApplication().getApplicationContext();
  }

  public ArrayList<ReactPackage> getPackages() {
    return new ArrayList<>(Arrays.<ReactPackage>asList(
      new MainReactPackage(mConfig),
      new ReactNativeConfigPackage(),
      new SvgPackage(),
      new BackgroundJobPackage(),
      new RCTMGLPackage(),
      new RNSensorsPackage(),
      new RNFusedLocationPackage(),
      new RNGestureHandlerPackage(),
      new InCallManagerPackage(),
      new LinearGradientPackage(),
      new RNLocalizePackage(),
      new RNScreensPackage(),
      new SnackbarPackage(),
      new RNSpinkitPackage(),
      new TextToSpeechPackage(),
      new VectorIconsPackage(),
      new WebRTCModulePackage(),
      new ReactVlcPlayerPackage(),
      new NetInfoPackage(),
      new ForegroundServicePackage(),
      new AsyncStoragePackage()
    ));
  }
}

[Alexandre Moureaux]

Ok so auto linking definitely seems to work but just not for this plugin
I don't know if anyone has tried to run on Windows yet, so maybe something we missed there in the configuration 🤔

2 things to dig further:

1. Are you example to run the example app from the example folder?

git clone https://github.com/bamlab/react-native-performance.git
cd example
yarn
yarn android

2. Also does it work if you manually link the plugin?

Add in android/settings.gradle

include ':react-native-flipper-performance-plugin'
project(':react-native-flipper-performance-plugin').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-flipper-performance-plugin/android')

and in android/app/build.gradle:

...
implementation "com.facebook.react:react-native:+"  // From node_modules
debugImplementation project(':react-native-flipper-performance-plugin') // add this line
...

[DavydVeremchuk]

Hey @Almouro!
Thank you for your help. I tried to run the example app and it runs without any problems.
Also I tried to link the plugin manually and it finally works fine. 😉

Any ideas why doesn't it link on its own?

[Alexandre Moureaux]

Glad to hear it @DavydVeremchuk! 🥳

But yeah, really weird that it works for the example app but not yours.
The only way I can see to try to debug that would be to try to check the differences between your app and the example app and reduce your app to a minimum reproducible example

(the example app was created with npx react-native init and then this plugin was installed)

I'd be happy to investigate myself if you can share a version of your app that reproduces the issue
and of course modified to be shareable with someone who's not in your company.

[DavydVeremchuk]

Hi @Almouro!

I managed to find a source of the problem. So, my company uses nx-monorepo to managed all of their apps inside a monorepo.

And thus there are two package.json files: the first one at the root of the folder with particular apps and the second one is unique for each app. Usually when you yarn add <name> + yarn run-android a package which should be autolinked it should automatically add it to the unique package.json and a package should be linked during the build.

But because of some problems with nx configuration in my project it didn't happen. Eventually I had to add it manually and now it works.

Edit: so eventually there's no problem with your plugin and this issue can be closed 😉

[Alexandre Moureaux]

Hi @DavydVeremchuk!

Great! That's good to know, thanks for getting to the bottom of this 🙏