React Native v0.59.2 android签名apk卡在启动画面

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了React Native v0.59.2 android签名apk卡在启动画面相关的知识,希望对你有一定的参考价值。

我最近将反应本机从0.55.4升级到0.59.2。我正在使用wix v1.1.486的本地导航。由于库中的一些函数抛出错误,我决定转向v2。我能够在ios上以完美的方式运行app并在调试模式下运行android

但是,当我试图生成一个签名的apk时,我面临着“无法从资产中加载脚本'index.android.bundle”问题,并且能够修复它(reference)

现在我被困在闪屏上。该应用程序不会进一步移动。

验证它在调试模式下工作。尝试使用空的主要活动所以没有问题。该项目使用redux,我在android studio中看到了最初的redux日志。尝试在模拟器和设备上运行。还反应本机run-android --variant = release有效。

安卓/的build.gradle

// Top-level build file where you can add configuration options common to all sub-projects/modules.

buildscript {
    ext {
        buildToolsVersion = "28.0.3"
        minSdkVersion = 21
        compileSdkVersion = 21
        targetSdkVersion = 27
        supportLibVersion = "28.0.0"
        googlePlayServicesVersion = "15.0.1"
        androidMapsUtilsVersion = "0.5+"
    }
    repositories {
        jcenter()
        mavenLocal()
        mavenCentral()
        google()
    }
    dependencies {
         classpath 'com.android.tools.build:gradle:3.3.2'
        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
    }
}

allprojects {
    repositories {
        google()
        mavenLocal()
        jcenter()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url "$rootDir/../node_modules/react-native/android"
        }
        maven { url "https://jitpack.io" }
    }
}

subprojects {
        afterEvaluate {project ->
                if (project.hasProperty("android")) {
                        android {
                                compileSdkVersion 28
                                buildToolsVersion '28.0.3'
                            }
                    }
            }
    }

    subprojects { subproject ->
    afterEvaluate {
        if ((subproject.plugins.hasPlugin('android') || subproject.plugins.hasPlugin('android-library'))) {
            android {
                variantFilter { variant ->
                    def names = variant.flavors*.name
                    if (names.contains("reactNative51") || names.contains("reactNative55")|| names.contains("reactNative56")|| names.contains("reactNative57")) {
                        setIgnore(true)
                    }
                }
            }
        }
    }
}

应用程序/的build.gradle

apply plugin: "com.android.application"

import com.android.build.OutputFile

project.ext.react = [
        entryFile: "index.js",
        bundleAssetName: "index.android.bundle",
        bundleInDebug: false,
        bundleInStaging: true,
        bundleInRelease: true,
        jsBundleDirDebug: "$buildDir/intermediates/assets/debug",
        resourcesDirDebug: "$buildDir/intermediates/res/merged/debug",
        jsBundleDirStaging: "$buildDir/intermediates/assets/staging",
        resourcesDirStaging:
                "$buildDir/intermediates/res/merged/staging",
        jsBundleDirRelease: "$buildDir/intermediates/assets/release",
        resourcesDirRelease:
                "$buildDir/intermediates/res/merged/release",
        devDisabledInDebug: false,
        devDisabledInStaging: true,
        devDisabledInRelease: true,
        inputExcludes: ["ios/**", "__tests__/**", "bundle_out/**"]
];

apply from: "../../node_modules/react-native/react.gradle"

project.ext.vectoricons = [
        iconFontNames: [ 'MaterialIcons.ttf', 'EvilIcons.ttf' ] // Name of the font files you want to copy
]

apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

/**
 * Set this to true to create two separate APKs instead of one:
 *   - An APK that only works on ARM devices
 *   - An APK that only works on x86 devices
 * The advantage is the size of the APK is reduced by about 4MB.
 * Upload all the APKs to the Play Store and people will download
 * the correct one based on the CPU architecture of their device.
 */
def enableSeparateBuildPerCPUArchitecture = false

/**
 * Run Proguard to shrink the Java bytecode in release builds.
 */
def enableProguardInReleaseBuilds = false

buildscript {
    repositories {
        maven { url 'https://maven.fabric.io/public' }
    }

    dependencies {
        classpath 'io.fabric.tools:gradle:1.+'
    }
}

apply plugin: 'io.fabric'

repositories {
    maven { url 'https://maven.fabric.io/public' }
}


android {
    compileSdkVersion rootProject.ext.compileSdkVersion

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }

    defaultConfig {
        applicationId "com.example"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 76
        versionName "1.0.76"
        ndk {
            abiFilters "armeabi-v7a", "x86"
        }
        multiDexEnabled true
    }

    signingConfigs {
        release {
            if (project.hasProperty('MYAPP_RELEASE_STORE_FILE')) {
                storeFile file(MYAPP_RELEASE_STORE_FILE)
                storePassword MYAPP_RELEASE_STORE_PASSWORD
                keyAlias MYAPP_RELEASE_KEY_ALIAS
                keyPassword MYAPP_RELEASE_KEY_PASSWORD
            }
        }
    }

    splits {
        abi {
            reset()
            enable enableSeparateBuildPerCPUArchitecture
            universalApk false  // If true, also generate a universal APK
            include "armeabi-v7a", "x86"
        }
    }
    buildTypes {
        release {
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
            signingConfig signingConfigs.release

        }
    }
    // applicationVariants are e.g. debug, release
    applicationVariants.all { variant ->
        variant.outputs.each { output ->
            // For each separate APK per architecture, set a unique version code as described here:
            // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits
            def versionCodes = ["armeabi-v7a":1, "x86":2, "arm64-v8a": 3, "x86_64": 4]
            def abi = output.getFilter(OutputFile.ABI)
            if (abi != null) {  // null for the universal-debug, universal-release variants
                output.versionCodeOverride =
                        versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
            }
        }
    }
}

configurations.all {
    resolutionStrategy.eachDependency { DependencyResolveDetails details ->
        def requested = details.requested
        if (requested.group == 'com.android.support' && requested.name != 'multidex') {
            details.useVersion "${rootProject.ext.supportLibVersion}"
        }
    }
}

dependencies {
    implementation project(':react-native-vector-icons')
    implementation project(':react-native-navigation')
    implementation "com.android.support:design:28.0.0"
    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"
    implementation "com.facebook.react:react-native:+"  // From node_modules
}

// 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'
}

main activity.Java

package com.example;

import android.content.Context;
import android.content.pm.PackageManager;
import android.graphics.Color;

import android.view.Window;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;

import com.crashlytics.android.Crashlytics;
import com.facebook.common.logging.FLog;

import io.fabric.sdk.android.Fabric;
import android.widget.RelativeLayout.LayoutParams;
import android.widget.TextView;
import com.reactnativenavigation.NavigationActivity;


public class MainActivity extends NavigationActivity {
   private String VersionName;
   private String VersionCode;

   @Override
   public void addDefaultSplashLayout() {

       Fabric.with(this, new Crashlytics());
       FLog.setLoggingDelegate(ReactNativeFabricLogger.getInstance());

       Context context = getApplicationContext();
       try
       {
           VersionName = context.getPackageManager().getPackageInfo(context.getPackageName(), 0).versionName;

           /*I find usefull to convert vervion code into String, so it's ready for TextViev/server side checks*/

           VersionCode = Integer.toString(context.getPackageManager().getPackageInfo(context.getPackageName(), 0).versionCode);
       } catch (PackageManager.NameNotFoundException e)
       {
           e.printStackTrace();
       }

       ImageView imageView = new ImageView(this);
       TextView textView = new TextView(this);

       RelativeLayout rl = new RelativeLayout(getApplicationContext());
       // Create LayoutParams for RelativeLayout
       LayoutParams lp = new RelativeLayout.LayoutParams(
               LayoutParams.MATCH_PARENT,
               LayoutParams.MATCH_PARENT
       );

       // Set RelativeLayout LayoutParams
       rl.setLayoutParams(lp);
       // Set a background color for RelativeLayout
       rl.setBackgroundColor(Color.parseColor("#ecf0f1"));

       // Create a LayoutParams for TextView widget
       LayoutParams lp_tv = new RelativeLayout.LayoutParams(
               LayoutParams.WRAP_CONTENT,
               LayoutParams.WRAP_CONTENT
       );

       lp_tv.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
       lp_tv.addRule(RelativeLayout.CENTER_HORIZONTAL);
       textView.setLayoutParams(lp_tv);

       LayoutParams lp_iv = new RelativeLayout.LayoutParams(
               LayoutParams.WRAP_CONTENT,
               LayoutParams.WRAP_CONTENT
       );
       lp_iv.addRule(RelativeLayout.CENTER_IN_PARENT);
       imageView.setLayoutParams(lp_iv);

       imageView.setImageResource(R.drawable.logo);
       textView.setText("V " + VersionName);
       textView.setPadding(0,0,0,8);

       rl.addView(imageView);
       rl.addView(textView);

       // inside your activity (if you did not enable transitions in your theme)
       getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);

       setContentView(rl);

   }


}

main application.Java

package com.example;

import com.facebook.react.ReactApplication;
import com.facebook.react.shell.MainReactPackage;
import com.facebook.soloader.SoLoader;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;

import com.reactnativenavigation.NavigationApplication;
import com.reactnativenavigation.react.NavigationReactNativeHost;
import com.reactnativenavigation.react.ReactGateway;

import java.util.Arrays;
import java.util.List;

import com.oblador.vectoricons.VectorIconsPackage;


public class MainApplication extends NavigationApplication {

    @Override
    protected ReactGateway createReactGateway() {
        ReactNativeHost host = new NavigationReactNativeHost(this, isDebug(), createAdditionalReactPackages()) {
            @Override
            protected String getJSMainModuleName() {
                return "index";
            }
        };
        return new ReactGateway(this, isDebug(), host);
    }

    @Override
    public boolean isDebug() {
        // Make sure you are using BuildConfig from your own application
       return BuildConfig.DEBUG;
        // return  true;
    }


    protected List<ReactPackage> getPackages() {
        // Add additional packages you require here
        // No need to add RnnPackage and MainReactPackage
        return Arrays.<ReactPackage>asList(
                new VectorIconsPackage(),
        );
    }

    @Override
    public List<ReactPackage> createAdditionalReactPackages() {
        return getPackages();
    }

}

从./gradlew assembleRelease生成签名的apk卡在启动画面/启动画面上。

答案

如果你的应用程序停留在启动画面,可能会隐藏一些错误,通常是在js包中。使用adb logcat *:E查看android的错误日志,你可能会更好地处理出错的地方

以上是关于React Native v0.59.2 android签名apk卡在启动画面的主要内容,如果未能解决你的问题,请参考以下文章

Match的React Native入门之旅

如何从 URL 下载图像并缓存 Android (React-Native)

什么可能导致 React Native 组件不断地卸载和重新安装?

为啥 react-native 包使用原生 SDK 而不是 JS/web 版本?

Android 设备上的 Apollo 网络错误(React Native)

学习React Native必看的几个开源项目