java - 升级React Native 0.61.5:Android停留在初始屏幕上

Question

我将React Native升级到0.61.5，iOS和Android部件成功编译。 iOS应用程序也成功启动，但Android应用程序未成功启动。

Android应用程序启动并停留在启动屏幕上，没有错误，因此我激活了日志adb logcat，并且发现了关于Flipper的错误：

System.err: java.lang.ClassNotFoundException: com.facebook.flipper.ReactNativeFlipper

经过2天的尝试，我不知道如何解决此问题。我已经遵循了React Native 0.6+和所有软件包的所有迁移过程。这是我的位置：

package.json

    "dependencies": {
        "@fortawesome/fontawesome-svg-core": "^1.2.25",
        "@fortawesome/pro-light-svg-icons": "^5.11.2",
        "@fortawesome/pro-solid-svg-icons": "^5.11.2",
        "@fortawesome/react-native-fontawesome": "^0.1.0",
        "@react-native-community/async-storage": "^1.6.3",
        "@react-native-community/netinfo": "^4.6.1",
        "@react-native-firebase/analytics": "^6.1.0",
        "@react-native-firebase/app": "^6.1.0",
        "bugsnag-react-native": "^2.23.2",
        "react": "16.9.0",
        "react-native": "0.61.5",
        "react-native-config": "^0.11.7",
        "react-native-dark-mode": "^0.2.1",
        "react-native-datepicker": "^1.7.2",
        "react-native-device-info": "^5.3.1",
        "react-native-gesture-handler": "^1.5.2",
        "react-native-iphone-x-helper": "^1.2.1",
        "react-native-keychain": "^4.0.1",
        "react-native-picker-select": "^6.3.3",
        "react-native-reanimated": "^1.4.0",
        "react-native-screens": "^2.0.0-alpha.17",
        "react-native-svg": "^9.13.3",
        "react-navigation": "^4.0.10",
        "react-navigation-drawer": "^2.3.3",
        "react-navigation-stack": "^1.10.3",
        "react-redux": "^7.1.1",
        "redux": "^4.0.1",
        "redux-logger": "^3.0.6",
        "redux-thunk": "^2.3.0"
    },
    "devDependencies": {
        "@babel/core": "^7.6.2",
        "@babel/preset-env": "^7.2.0",
        "@babel/runtime": "^7.6.2",
        "@types/enzyme": "^3.1.15",
        "@types/enzyme-adapter-react-16": "^1.0.3",
        "@types/jest": "^24.0.12",
        "@types/node": "^12.11.5",
        "@types/react": "^16.8.16",
        "@types/react-native": "^0.60.23",
        "@types/react-native-datepicker": "^1.7.0",
        "@types/react-native-vector-icons": "^6.4.4",
        "@types/react-navigation": "^3.4.0",
        "@types/react-redux": "^7.0.8",
        "@types/react-test-renderer": "^16.8.1",
        "@types/redux-logger": "^3.0.6",
        "@types/sinon": "^7.0.2",
        "babel-jest": "^24.8.0",
        "babel-plugin-transform-remove-console": "^6.9.4",
        "enzyme": "^3.7.0",
        "enzyme-adapter-react-16": "^1.7.0",
        "enzyme-to-json": "^3.3.5",
        "jest": "^24.8.0",
        "jest-fetch-mock": "^2.0.1",
        "metro-react-native-babel-preset": "^0.57.0",
        "pre-commit": "^1.2.2",
        "react-dom": "^16.6.3",
        "react-test-renderer": "^16.12.0",
        "sinon": "^7.2.2",
        "snapshot-diff": "^0.4.1",
        "ts-jest": "^24.0.2",
        "tslint": "^5.17.0",
        "typescript": "^3.7.3"
    },

android / app / build.gradle

dependencies {
    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation "com.facebook.react:react-native:+"  // From node_modules
    implementation 'androidx.appcompat:appcompat:1.1.0-rc01'
    implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0-alpha02'

    if (enableHermes) {
        def hermesPath = "../../node_modules/hermes-engine/android/";
        debugImplementation files(hermesPath + "hermes-debug.aar")
        releaseImplementation files(hermesPath + "hermes-release.aar")
    } else {
        implementation jscFlavor
    }
}

configurations.all {
     resolutionStrategy {
       force "com.facebook.soloader:soloader:0.8.0"
     }
}

// Run this once to be able to run the application with BUCK
// puts all compile dependencies into folder libs for BUCK to use
task copyDownloadableDepsToLibs(type: Copy) {
    from configurations.compile
    into "libs"
}

apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)

apply plugin: "com.google.gms.google-services"

MainActivity.java

package com.dedge.centralinventory;

import android.os.Bundle;
import com.facebook.react.ReactFragmentActivity;
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

public class MainActivity extends ReactFragmentActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(null);
    }

    @Override
    protected ReactActivityDelegate createReactActivityDelegate() {
        return new ReactActivityDelegate(this, getMainComponentName()) {
            @Override
            protected ReactRootView createRootView() {
                return new RNGestureHandlerEnabledRootView(MainActivity.this);
            }
        };
    }
}

MainApplication.java

package com.dedge.centralinventory;

import android.app.Application;
import android.content.Context;
import com.facebook.react.PackageList;
import com.facebook.react.ReactApplication;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.soloader.SoLoader;

import java.lang.reflect.InvocationTargetException;
import java.util.List;

public class MainApplication extends Application implements ReactApplication {

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

        @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();
            return packages;
        }

        @Override
        protected String getJSMainModuleName() {
            return "index";
        }
    };

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

    @Override
    public void onCreate() {
        super.onCreate();
        SoLoader.init(this, /* native exopackage */ false);
        initializeFlipper(this); // Remove this line if you don't want Flipper enabled
    }

    /**
     * Loads Flipper in React Native templates.
     *
     * @param context
     */
    private static void initializeFlipper(Context context) {
        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);
            } catch (ClassNotFoundException e) {
                e.printStackTrace();
            } catch (NoSuchMethodException e) {
                e.printStackTrace();
            } catch (IllegalAccessException e) {
                e.printStackTrace();
            } catch (InvocationTargetException e) {
                e.printStackTrace();
            }
        }
    }
}

我试图删除此行initializeFlipper(this);，但未更改任何内容。

解决

最后，我解决了我的问题。 initializeFlipper(this);是我的问题的第一部分。它与最新版本的React Native（0.61.x）不兼容。所以我删除了这一行。

紧接着，我删除了react-native-splash-screens进行React Native升级，却忘记了从protected void onCreate(Bundle savedInstanceState)中删除​​MainActivity.java的替代内容，从而使应用程序停留在初始屏幕上。

Answer 1

确保您使用的是XCode10。以下指南不适用于XCode 11。
在这里检查
https://fbflipper.com/docs/getting-started.html#ios