error: cannot find symbol ReactNativeFlipper.initializeFlipper(this, getReactNativeHost().getReactInstanceManager())

LayMui commented 1 year ago

New Version

0.71.7

Old Version

0.67.5

Build Target(s)

android emulator

Output of `react-native info`

System: OS: macOS 13.3.1 CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz Memory: 212.56 MB / 16.00 GB Shell: 5.9 - /bin/zsh Binaries: Node: 16.19.1 - /usr/local/opt/node@16/bin/node Yarn: 1.22.19 - /usr/local/bin/yarn npm: 8.19.3 - /usr/local/opt/node@16/bin/npm Watchman: 2023.04.17.00 - /usr/local/bin/watchman Managers: CocoaPods: 1.12.1 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: DriverKit 22.2, iOS 16.2, macOS 13.1, tvOS 16.1, watchOS 9.1 Android SDK: API Levels: 28, 29, 30, 31, 32, 33 Build Tools: 28.0.3, 29.0.2, 30.0.2, 30.0.3, 31.0.0, 32.0.0, 32.1.0, 33.0.0, 34.0.0 System Images: android-30 | Google Play Intel x86 Atom, android-31 | Google APIs Intel x86 Atom_64, android-31 | Google Play Intel x86 Atom_64 Android NDK: Not Found IDEs: Android Studio: 2021.1 AI-211.7628.21.2111.8309675 Xcode: 14.2/14C18 - /usr/bin/xcodebuild Languages: Java: 11.0.11 - /usr/bin/javac npmPackages: @react-native-community/cli: Not Found react: 18.2.0 => 18.2.0 react-native: ^0.71.7 => 0.71.7 react-native-macos: Not Found npmGlobalPackages: react-native: Not Found

Issue and Reproduction Steps

yarn to install all dependencies set environment variables as needed for android export ANDROID_SDK_ROOT=~/Library/Android/sdk export ANDROID_HOME=~/Library/Android/sdk export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk-11.0.14.jdk/Contents/Home export JAVA_HOME="/Applications/Android Studio.app/Contents/jre/Contents/Home" export PATH=$ANDROID_HOME/tools:$ANDROID_HOME/tools/bin:$ANDROID_HOME/emulator:$ANDROID_HOME/platform-tools:$PATH

launch the android emulator

cd android yarn android

build error:

BUILD FAILED in 1m 5s

error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup. Error: Command failed: ./gradlew app:installDebug -PreactNativeDevServerPort=8081 /xxxx/android/app/src/main/java/com/usermanagement/testapp/MainApplication.java:61: error: cannot find symbol ReactNativeFlipper.initializeFlipper(this, getReactNativeHost().getReactInstanceManager()); ^ symbol: variable ReactNativeFlipper location: class MainApplication 1 error

FAILURE: Build completed with 2 failures.

1: Task failed with an exception.

What went wrong: Execution failed for task ':app:compileDebugJavaWithJavac'.

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. Run with --scan to get full insights.

2: Task failed with an exception.

What went wrong: java.lang.StackOverflowError (no error message)
Try:

Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
Get more help at https://help.gradle.org

BUILD FAILED in 1m 5s

at makeError (/xxxx/node_modules/execa/index.js:174:9)
at /xxxxx/node_modules/execa/index.js:278:16
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async runOnAllDevices (/xxxx/node_modules/@react-native-community/cli-platform-android/build/commands/runAndroid/runOnAllDevices.js:82:7)
at async Command.handleAction (/xxxx/node_modules/@react-native-community/cli/build/index.js:108:9)

info Run CLI with --verbose flag for more details. error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

cortinico commented 1 year ago

Do you have the ReactNativeFlipper.java files? You should have 2 of them? Can you show what's their path (run find . | grep ReactNativeFlipper) and what's their content?

LayMui commented 1 year ago

okay I got this issue resolved after I added the another ReactNativeFlipper.java with similar content in the debug path /android/app/src/debug/java/com/xxx/ReactNativeFlipper.java /android/app/src/release/java/com/xxx/ReactNativeFlipper.java

jasonkahkeat commented 1 year ago

find . | grep ReactNativeFlipper

I am facing similar issue when trying to deploy a staging build with fastlane to Firebase App Distribution. Below is the result of find . | grep ReactNativeFlipper

./node_modules/react-native/template/android/app/src/release/java/com/helloworld/ReactNativeFlipper.java ./node_modules/react-native/template/android/app/src/debug/java/com/helloworld/ReactNativeFlipper.java ./android/app/src/release/java/com/{appName}/ReactNativeFlipper.java ./android/app/src/debug/java/com/{appName}/ReactNativeFlipper.java

Below is the content of debug/java/com/{appName}/ReactNativeFlipper.java. I'm not sure if this has to do with renaming the identifier of the app, as I did rename the app from com.appname to something like com.app.name. But I've also ensured that all the old ID have been renamed to the new one.

/**
 * Copyright (c) Meta Platforms, Inc. and affiliates.
 *
 * <p>This source code is licensed under the MIT license found in the LICENSE file in the root
 * directory of this source tree.
 */
package com.app.name;

import android.content.Context;
import com.facebook.flipper.android.AndroidFlipperClient;
import com.facebook.flipper.android.utils.FlipperUtils;
import com.facebook.flipper.core.FlipperClient;
import com.facebook.flipper.plugins.crashreporter.CrashReporterPlugin;
import com.facebook.flipper.plugins.databases.DatabasesFlipperPlugin;
import com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin;
import com.facebook.flipper.plugins.inspector.DescriptorMapping;
import com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin;
import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor;
import com.facebook.flipper.plugins.network.NetworkFlipperPlugin;
import com.facebook.flipper.plugins.sharedpreferences.SharedPreferencesFlipperPlugin;
import com.facebook.react.ReactInstanceEventListener;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.bridge.ReactContext;
import com.facebook.react.modules.network.NetworkingModule;
import okhttp3.OkHttpClient;

/**
 * Class responsible of loading Flipper inside your React Native application. This is the debug
 * flavor of it. Here you can add your own plugins and customize the Flipper setup.
 */
public class ReactNativeFlipper {
  public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
    if (FlipperUtils.shouldEnableFlipper(context)) {
      final FlipperClient client = AndroidFlipperClient.getInstance(context);

      client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));
      client.addPlugin(new DatabasesFlipperPlugin(context));
      client.addPlugin(new SharedPreferencesFlipperPlugin(context));
      client.addPlugin(CrashReporterPlugin.getInstance());

      NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
      NetworkingModule.setCustomClientBuilder(
          new NetworkingModule.CustomClientBuilder() {
            @Override
            public void apply(OkHttpClient.Builder builder) {
              builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
            }
          });
      client.addPlugin(networkFlipperPlugin);
      client.start();

      // Fresco Plugin needs to ensure that ImagePipelineFactory is initialized
      // Hence we run if after all native modules have been initialized
      ReactContext reactContext = reactInstanceManager.getCurrentReactContext();
      if (reactContext == null) {
        reactInstanceManager.addReactInstanceEventListener(
            new ReactInstanceEventListener() {
              @Override
              public void onReactContextInitialized(ReactContext reactContext) {
                reactInstanceManager.removeReactInstanceEventListener(this);
                reactContext.runOnNativeModulesQueueThread(
                    new Runnable() {
                      @Override
                      public void run() {
                        client.addPlugin(new FrescoFlipperPlugin());
                      }
                    });
              }
            });
      } else {
        client.addPlugin(new FrescoFlipperPlugin());
      }
    }
  }
}

cortinico commented 1 year ago

trying to deploy a staging build with fastlane to Firebase App Distribution

Is it because you now have a staging build type as well? If so you then need a staging/java/com/{appName}/ReactNativeFlipper.java file as well

jasonkahkeat commented 1 year ago

I've tried duplicating the file from release into a newly created staging folder, but the same error appears. Do I need to change the configuration on build.gradle as well? (Sorry I'm not too familiar with the native part)

buildTypes in build.gradle

    buildTypes {
        debug {
            signingConfig signingConfigs.debug
        }
        releaseStaging {
            signingConfig signingConfigs.debug
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
            matchingFallbacks = ['release']
        }
        release {
            // Caution! In production, you need to generate your own keystore file.
            // see https://reactnative.dev/docs/signed-apk-android.
            signingConfig signingConfigs.debug
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }

cortinico commented 1 year ago

into a newly created staging folder

The folder needs to be inside releaseStaging/java/com/{appName}/ReactNativeFlipper.java as your buildTypes definition

jasonkahkeat commented 1 year ago

into a newly created staging folder

The folder needs to be inside releaseStaging/java/com/{appName}/ReactNativeFlipper.java as your buildTypes definition

Oh thank you so much! It works now and I think I've got a better understanding.

alexberezin commented 1 year ago

into a newly created staging folder

The folder needs to be inside releaseStaging/java/com/{appName}/ReactNativeFlipper.java as your buildTypes definition

It worked for me, thank you very much!

tuiza commented 6 months ago

For me the problem was that I had forgotten to add implementation("com.facebook.react:flipper-integration") in android/app/build.gradle as described in Upgrade Helper

dependencies { implementation("com.facebook.react:flipper-integration") }

nangongmoyan commented 5 months ago

in my build.gradle

buildTypes {
        debug {
            signingConfig signingConfigs.config

            buildConfigField "boolean", "DEBUG", "true"
            matchingFallbacks = ['debug']
        }

        staging {
            signingConfig signingConfigs.config
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"

            buildConfigField "boolean", "DEBUG", "true"
            matchingFallbacks = ['staging','debug','release']
        }
        release {
            signingConfig signingConfigs.config
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"

            buildConfigField "boolean", "DEBUG", "false"
            matchingFallbacks = ['release']
        }
    }

dependencies {
    debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
        exclude group:'com.facebook.fbjni'
    }

    debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
        exclude group:'com.facebook.flipper'
        exclude group:'com.squareup.okhttp3', module:'okhttp'
    }

    stagingImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
        exclude group:'com.facebook.fbjni'
    }

    stagingImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
        exclude group:'com.facebook.flipper'
        exclude group:'com.squareup.okhttp3', module:'okhttp'
    }
}

and add staging/java/com/{appName}/ReactNativeFlipper.java(from debug/java/com/{appName}/ReactNativeFlipper.java) but receive an error: Failed to exchange certificates with the following error: No matching device found for app: com.appdemo from Flipper

tips: in buildType debug is sucess

can I solve this problem?

facebook / react-native