Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Adding Flipper to an existing React Native project
diff --git a/android/app/build.gradle b/android/app/build.gradle
index 6560b78..eade6f6 100644
--- a/android/app/build.gradle
+++ b/android/app/build.gradle
@@ -176,12 +176,21 @@ android {
}
}
+ packagingOptions {
+ pickFirst '**/libc++_shared.so'
+ }
}
dependencies {
implementation fileTree(dir: "libs", include: ["*.jar"])
implementation "com.facebook.react:react-native:+" // From node_modules
+ debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
+ exclude group:'com.facebook.yoga'
+ exclude group:'com.facebook.flipper', module: 'fbjni'
+ exclude group:'com.facebook.litho', module: 'litho-annotations'
+ }
+
if (enableHermes) {
def hermesPath = "../../node_modules/hermes-engine/android/";
debugImplementation files(hermesPath + "hermes-debug.aar")
diff --git a/android/app/src/main/java/com/rnapp_old/MainApplication.java b/android/app/src/main/java/com/rnapp_old/MainApplication.java
index 38aa276..68e110a 100644
--- a/android/app/src/main/java/com/rnapp_old/MainApplication.java
+++ b/android/app/src/main/java/com/rnapp_old/MainApplication.java
@@ -2,11 +2,14 @@ package com.rnapp_old;
import android.app.Application;
import android.content.Context;
+
import com.facebook.react.PackageList;
import com.facebook.react.ReactApplication;
+import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.soloader.SoLoader;
+
import java.lang.reflect.InvocationTargetException;
import java.util.List;
@@ -43,23 +46,30 @@ public class MainApplication extends Application implements ReactApplication {
public void onCreate() {
super.onCreate();
SoLoader.init(this, /* native exopackage */ false);
- initializeFlipper(this); // Remove this line if you don't want Flipper enabled
+ initializeFlipper(
+ this,
+ getReactNativeHost()
+ .getReactInstanceManager()); // Remove this line if you don't want Flipper enabled
}
/**
- * Loads Flipper in React Native templates.
+ * Loads Flipper in React Native templates. Call this in the onCreate method with something like
+ * initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
*
* @param context
*/
- private static void initializeFlipper(Context context) {
+ private static void initializeFlipper(
+ Context context, ReactInstanceManager reactInstanceManager) {
if (BuildConfig.DEBUG) {
try {
/*
We use reflection here to pick up the class that initializes Flipper,
since Flipper library is not available in release mode
*/
- Class<?> aClass = Class.forName("com.facebook.flipper.ReactNativeFlipper");
- aClass.getMethod("initializeFlipper", Context.class).invoke(null, context);
+ Class<?> aClass = Class.forName("com.rnapp_old.ReactNativeFlipper");
+ aClass
+ .getMethod("initializeFlipper", Context.class, ReactInstanceManager.class)
+ .invoke(null, context, reactInstanceManager);
} catch (ClassNotFoundException e) {
e.printStackTrace();
} catch (NoSuchMethodException e) {
diff --git a/android/gradle.properties b/android/gradle.properties
index 027ef9d..01f6020 100644
--- a/android/gradle.properties
+++ b/android/gradle.properties
@@ -19,3 +19,5 @@
android.useAndroidX=true
android.enableJetifier=true
+
+FLIPPER_VERSION=0.23.4
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment