Wie kann ich eine Apk generieren, die ohne Server mit React-Native ausgeführt werden kann?

Ich habe meine App erstellt und kann sie auf meinem lokalen Emulator (und auch auf meinem Android-Gerät im selben Netzwerk durch Ändern des Debug-Servers) ausführen.

Ich möchte jedoch eine APK erstellen, die ich an jemanden ohne Zugriff auf den Entwicklungsserver senden kann, und ich möchte, dass er die Anwendung testen kann.

Ich sehe, dass es in der Dokumentation einen Abschnitt zum Verwenden des Offline-Bundles unter iOS gibt. Aber ich konnte nicht herausfinden, wie ich das gleiche für Android erreichen kann. Ist das möglich? Wenn das so ist, wie?

UPDATE: Bei der Beantwortung dieser Frage ( Android konnte das JS-Bundle nicht laden ) heißt es, dass das Offline-Bundle vom Entwicklungsserver heruntergeladen werden kann. Wenn ich das Bundle vom Entwicklungsserver erhalte, können die Bilddateien nicht geladen werden.

Nach der Antwort von Aditya Singh wurde die generierte (nicht signierte) apk nicht auf meinem Telefon installiert. Ich musste eine signierte apk mit den anweisungen hier generieren .

Folgendes hat bei mir funktioniert:

$ keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000

Legen Sie die my-release-key.keystoreDatei unter dem android/app Verzeichnis in Ihrem Projektordner ab. Bearbeiten Sie dann die Datei ~/.gradle/gradle.propertiesund fügen Sie Folgendes hinzu (ersetzen Sie **** durch das richtige Keystore-Passwort, Alias ​​und Schlüssel-Passwort).

MYAPP_RELEASE_STORE_FILE=my-release-key.keystore
MYAPP_RELEASE_KEY_ALIAS=my-key-alias
MYAPP_RELEASE_STORE_PASSWORD=****
MYAPP_RELEASE_KEY_PASSWORD=****

Wenn Sie MacOS verwenden, können Sie Ihr Kennwort anhand der Anweisungen hier im Schlüsselbund speichern, anstatt es im Klartext zu speichern.

Bearbeiten Sie dann app / build.gradle und stellen Sie sicher, dass Folgendes vorhanden ist (die Abschnitte mit signierenConfigs Signaturkonfiguration müssen möglicherweise hinzugefügt werden):

...
android {
    ...
    defaultConfig { ... }
    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
            }
        }
    }
    buildTypes {
        release {
            ...
            signingConfig signingConfigs.release
        }
    }
}
...

Dann führen Sie den Befehl cd android && ./gradlew assembleRelease,

Für Windows 'cd android' und dann gradlew assembleReleaseBefehl ausführen , und finden Sie Ihre signierte apk unterandroid/app/build/outputs/apk/app-release.apk

Sie müssen einen Schlüssel erstellen, um die apk zu signieren. Verwenden Sie unten, um Ihren Schlüssel zu erstellen:

 keytool -genkey -v -keystore my-app-key.keystore -alias my-app-alias -keyalg RSA -keysize 2048 -validity 10000

Verwenden Sie ein Passwort, wenn Sie dazu aufgefordert werden

Sobald der Schlüssel generiert wurde, generieren Sie damit den installierbaren Build:

 react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/

Generieren Sie den Build mit gradle

 cd android && ./gradlew assembleRelease

Laden Sie die APK auf Ihr Telefon hoch. Das -rFlag ersetzt die vorhandene App (falls vorhanden).

adb install -r ./app/build/outputs/apk/app-release-unsigned.apk

Eine detailliertere Beschreibung finden Sie hier: https://facebook.github.io/react-native/docs/signed-apk-android.html

UPDATE : Basierend auf Kommentaren von @shashuec und @Fallen

wenn Sie Fehler erhalten

ENOENT: Keine solche Datei oder kein solches Verzeichnis. Öffnen Sie 'android / app / src / main / assets / index.android.bundle'.

Führen Sie mkdir android / app / src / main / assets aus

Sie sollten nur Android Studio für diesen Prozess verwenden. Es ist einfach einfacher. Führen Sie diesen Befehl jedoch zuerst in Ihrem nativen App-Verzeichnis aus:

Für neuere Versionen von React-Native (z. B. React Native 0.49.0 usw.)

react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

Für ältere Versionen von React-Native (0.49.0 und niedriger)

react-native bundle --platform android --dev false --entry-file index.android.js   --bundle-output android/app/src/main/assets/index.android.bundle   --assets-dest android/app/src/main/res/

Verwenden Sie dann Android Studio, um den Ordner "Android" in Ihrem nativen App-Verzeichnis zu öffnen. Sie werden aufgefordert, Gradle und einige andere Dinge zu aktualisieren. Gehen Sie zu build-> Generate signed APK und folgen Sie den Anweisungen von dort. Es ist wirklich einfach.

Führen Sie diesen Befehl aus:

react-native run-android --variant=release

Beachten Sie, dass dies --variant=releasenur verfügbar ist, wenn Sie das Signieren mit eingerichtet haben cd android && ./gradlew assembleRelease.

für React Native 0.49 und höher

Sie sollten in das Projektverzeichnis auf dem Terminal gehen und diesen Befehl ausführen

1 - mkdir android/app/src/main/assets
2 - react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

wenn unter 0,49

  1 - mkdir android/app/src/main/assets
  2 - react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

Verwenden Sie dann Android Studio, um den Ordner "Android" in Ihrem nativen App-Verzeichnis zu öffnen. Sie werden aufgefordert, Gradle und einige andere Dinge zu aktualisieren. Gehen Sie zu build-> Generate signed APK und folgen Sie den Anweisungen von dort. Das okey.

Wenn du bekommst Failure [INSTALL_PARSE_FAILED_NO_CERTIFICATES].

Ich habe versucht, die Methode von @ Aditya zu verwenden, um eine nicht signierte APK-Datei zu generieren und diese zu installieren. Als ich sie jedoch auf meinem Android-Tablet installierte, gab es einen Fehler von Failure [INSTALL_PARSE_FAILED_NO_CERTIFICATES].

Ich stelle mir das vor, weil die APK-Datei nicht signiert war und das Tablet damit nicht zufrieden war. Nachdem ich die React Native-Bundle-Datei generiert hatte, konnte ich wie gewohnt eine signierte APK-Datei über Android Studio generieren.

Übrigens, unsere App ist eine voll funktionsfähige Android-App, die es bereits im Play Store gibt, und wir fügen React Native nur in mundgerechten Teilen hinzu, weil sie fantastisch ist.

Zusammenfassend waren hier meine Schritte:

1) React Native-Bundle generieren:

react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/<your-package-name>/src/main/assets/index.android.bu‌​ndle --assets-dest android/<your-package-name>/src/main/res/ 

2) Generieren Sie eine signierte APK-Datei aus Android Studio.

3) Installieren Sie die signierte APK-Datei auf einem USB-Gerät:

adb -d install -r <path_to_signed_apk> 

Das -dFlag weist nur an, dass adbes auf dem angeschlossenen USB-Gerät installiert werden soll, falls auch ein Emulator ausgeführt wird. Wenn Sie auf einem beliebigen Emulator installieren möchten, lassen Sie das -dFlag fallen.

4) Gewinn!

Versuchen Sie es unten, es wird eine app-debug.apk in Ihrem root / android / app / build / output / apk / debug Ordner generiert

react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

Dann gehe zum Android-Ordner und starte

./gradlew assembleDebug

Wenn jemand ohne Playstore-Schlüssel bauen möchte, ist dieser Befehl sehr hilfreich.

# react-native run-android --variant=release

Nach Abschluss des Builds finden Sie die apk in der Release-Build-Datei.

Gehen Sie zum Projektverzeichnis und führen Sie den folgenden Befehl aus:

cd android && ./gradlew assembleRelease

Wenn Sie eine Fehlermeldung mit index.android.js erhalten. Dies liegt daran, dass Sie die neue React-native Version verwenden (ich verwende 0.55.4). Ersetzen Sie einfach "index.android.js" durch "index.js".

react-native bundle --platform android --dev false --entry-file index.js   --bundle-output android/app/src/main/assets/index.android.bundle   --assets-dest android/app/src/main/res/

Ich habe eine andere Lösung: - Generieren eines Signaturschlüssels Mit keytool können Sie einen privaten Signaturschlüssel generieren. Unter Windows muss das Keytool unter C: \ Programme \ Java \ jdkx.x.x_x \ bin ausgeführt werden.

$ keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000

Legen Sie die Datei my-release-key.keystore im Verzeichnis android / app in Ihrem Projektordner ab.

Bearbeiten Sie die Datei android / app / build.gradle in Ihrem Projektordner und fügen Sie die Signaturkonfiguration hinzu.

android {
....
signingConfigs { 
  release { 

      storeFile file('my-release-key.keystore') 
      storePassword 'yourpassword' 
      keyAlias 'my-key-alias' 
      keyPassword 'yourpassword' 

  } 
}}}


buildTypes {release {signingConfig signingConfigs.release}}

und Renn

gradlew assembleRelease

Dadurch erhalten Sie zwei Dateien unter android \ app \ build \ output \ apk app-release.apk und app-release-unsigned.apk. Installieren Sie jetzt die app-release.apk auf Ihrem Android-Gerät.

Hoffentlich hilft es neuen Anfängern

Offizielles Dokument hier

Wenn Sie keinen Keystore haben, verwenden Sie ihn vor dem Befehl

Generieren eines Signaturschlüssels / einer Keystore-Datei Mit keytool können Sie einen privaten Signaturschlüssel generieren. Unter Windows muss das Keytool unter C: \ Programme \ Java \ jdkx.x.x_x \ bin ausgeführt werden.

$ keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000

Sie erhalten eine Datei wie my-release-key.keystore

Einrichten von Gradle-Variablen Legen Sie die Datei my-release-key.keystore im Verzeichnis android / app in Ihrem Projektordner ab. Bearbeiten Sie die Datei android / gradle.properties und die folgenden hinzufügen (ersetzen ***** mit den richtigen Kennwort für Schlüsselspeicher, alias und Key - Passwort), ist enableAapt2 Satz falsches Problem zu umgehen, als android gradle Version 3.0 Problem

MYAPP_RELEASE_STORE_FILE=my-release-key.keystore
MYAPP_RELEASE_KEY_ALIAS=my-key-alias
MYAPP_RELEASE_STORE_PASSWORD=*****
MYAPP_RELEASE_KEY_PASSWORD=*****

android.enableAapt2=false

dann füge diese app / buid.gradle (app) hinzu

unter der Standardkonfiguration

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

und Inside Build Typ Release {}

 signingConfig signingConfigs.release

Führen Sie diesen Befehl dann einfach im Android Studio Terminal aus. Die folgenden Befehle automatisieren vor allem die Antworten

wenn Windows

cd android
gradlew assembleRelease

wenn Linux / Mac

$ cd android
$ ./gradlew assembleRelease

Wenn Sie eine Fehlermeldung erhalten, löschen Sie alle Build-Ordner und führen Sie den Befehl aus

gradlew clean

als wieder

gradlew assembleRelease

Für die neuesten reagieren native Versionen, um das Projekt zu bündeln

Android

react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/

iOS

react-native bundle --entry-file index.js --platform ios --dev false --bundle-output ios/main.jsbundle --assets-dest ios

Die GUI-Methode in Android Studio

• Öffnen Sie die Android-App in der React Native-App in Android Studio (dies bedeutet lediglich, dass Sie den Android-Ordner Ihres React-Native-Projekts mit Android Studio öffnen).
• Gehen Sie oben zur Registerkarte "Erstellen"
• Gehen Sie zu "Bundle (s) / APK (s) erstellen".
• Wählen Sie dann "APK (s) erstellen".
• Dies führt Sie durch einen Prozess zum Auffinden Ihrer Schlüssel zum Signieren der APK oder zum Erstellen Ihrer Schlüssel, wenn Sie diese noch nicht haben, was alles sehr einfach ist. Wenn Sie nur üben, können Sie diese Schlüssel generieren und auf Ihrem Desktop speichern.
• Sobald dieser Vorgang abgeschlossen ist und der Build erfolgreich war, wird unten in Android Studio ein Popup angezeigt. Klicken Sie auf den darin enthaltenen Link "Lokalisieren" (APK).
• Das bringt dich zur apk Datei, verschiebe sie auf dein Android Gerät. Navigieren Sie dann zu dieser Datei auf dem Android-Gerät und installieren Sie sie.

Die Verwendung von Android Studio zum Generieren von signierten Apk für das Android-Projekt von React ist ebenfalls eine gute und einfache Option. Öffnen Sie das Android-Projekt von React in Android Studio und generieren Sie Tastenanschläge und signierte Apk.

Weitere Informationen finden Sie in der offiziellen Dokumentation zum Generieren signierter APK

React-Native Generating Signed APK