Créer et installer un apk non signé sur l'appareil sans le serveur de développement?


166

Comme je suis nouveau dans React-Native, si quelque chose ne va pas dans les étapes, faites-le moi savoir.

J'ai créé une application Android native React en utilisant la commande selon la documentation

android natif de réaction

lors de l'exécution sur l'appareil, la commande suivante a été utilisée

réaction native run-android

ce qui me donne la sortie de 2 fichiers apk dans mon dossier de projet / android / app / build / sorties / apk

entrez la description de l'image ici

maintenant, lorsque j'utilise pour installer cet apk après l'installation, il demande à un serveur de développement de se connecter pour regrouper le JS. Mais mon exigence est que l'utilisateur n'ait pas à se débattre avec le serveur de développement, il doit simplement installer l'apk et tout est fait.

J'ai parcouru quelques questions sur le stackoverflow mais pas utile pour créer un apk non signé qui ne nécessite pas de serveur de développement.

Pouvez-vous m'aider à trouver comment créer un apk non signé en natif?


1
Exécutez 'react-native start', il servira votre bundle js en mode développement. Le but est que vous puissiez éditer des fichiers js à la volée. Utiliser le mode release ne nécessite aucun serveur car il inclura le bundle nécessaire avec lui. Voir la réponse ci
kar

Réponses:


250

Vous devez créer manuellement le bundle pour une version de débogage.

Compilation de débogage de bundle:

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

#React-Native 0.49.0+
react-native bundle --dev false --platform android --entry-file index.js --bundle-output ./android/app/build/intermediates/assets/debug/index.android.bundle --assets-dest ./android/app/build/intermediates/res/merged/debug

#React-Native 0-0.49.0
react-native bundle --dev false --platform android --entry-file index.android.js --bundle-output ./android/app/build/intermediates/assets/debug/index.android.bundle --assets-dest ./android/app/build/intermediates/res/merged/debug

Ensuite, pour créer l'APK après le regroupement:

$ cd android
#Create debug build:
$ ./gradlew assembleDebug
#Create release build:
$ ./gradlew assembleRelease #Generated `apk` will be located at `android/app/build/outputs/apk`

PS Une autre approche pourrait être de modifier les scripts gradle.


3
Au cas où quelqu'un manquerait d'actifs: cela a fonctionné pour moi--assets-dest ./android/app/src/main/res/
Juan Solano

11
Et si cela me donne un grand écran rouge lorsque je lance l'application? (Remarque: je l'exécute directement après l'éjection)
Simon Forsberg

3
Comment prendre build pour la dernière version car nous n'avons pas index.android.js?
Vivek

9
Les personnes avec la dernière version, veuillez changer le point d'entrée en --entry-file index.js, merci.
Rishabh Bhatia

4
bundle react-native --dev false --platform android --entry-file index.js --bundle-output ./android/app/build/intermediates/assets/debug/index.android.bundle --assets-dest. / android / app / build / intermediates / res / merged / debug pour la nouvelle version réactionnelle où l'index.js est unifié pour iOS et Android
ir2pid

101

Veuillez suivre ces étapes.

Regroupez vos js:

si vous avez index.android.js dans la racine du projet, exécutez

react-native bundle --dev false --platform android --entry-file index.android.js --bundle-output ./android/app/build/intermediates/assets/debug/index.android.bundle --assets-dest ./android/app/build/intermediates/res/merged/debug

si vous avez index.js dans la racine du projet, exécutez

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

Créez un apk de débogage:

cd android/
./gradlew assembleDebug

Ensuite, vous pouvez trouver votre apk ici:

cd app/build/outputs/apk/

11
Et si cela me donne un grand écran rouge lorsque je lance l'application? (Remarque: je l'exécute directement après l'éjection)
Simon Forsberg

2
@SimonForsberg si vous utilisez react ^ 0.5, changez le point d'entrée en index.js au lieu de App.js ou index.android.js, react-native bundle --dev false --platform android --entry-file index.js --bundle-output ./android/app/build/intermediates/assets/debug/index.android.bundle --assets-dest ./android/app/build/intermediates/res/merged/debug
d.bayo

3
Ne fonctionne pas, cela commande la construction d'un apk mais cet apk ne fonctionne pas sans serveur de packager.
Vishal Chhodwani

1
Cela ne fonctionnera pas, car cela nécessite un serveur de développement
sheriff_paul

1
J'ai le même problème, lors de la génération du debug-APK, je pourrais l'installer, mais j'ai besoin du serveur de développement, et lorsque j'utilise la version APK, je ne peux pas l'installer sur mon téléphone, je ne sais pas quoi est faux avec lui
aName

62

Dernière mise à jour

Dans votre répertoire de projet racine

Assurez-vous que vous avez déjà le répertoire android / app / src / main / assets / , sinon créez un répertoire, après cela, créez un nouveau fichier et enregistrez-le sous index.android.bundleet placez votre fichier comme cet android / app / src / main / assets / index.android .paquet

Après cela, exécutez ceci

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/

cd android && ./gradlew assembleDebug

Ensuite, vous pouvez accéder apkà app / build / sorties / apk / debug / app-debug.apk


Cette réponse fonctionne vraiment, merci beaucoup,
aName

Cette réponse fonctionne vraiment, merci beaucoup,
aName

@jeeva: comment reconnecter l'application au serveur de développement de React Native?
Mayur Baldha

Le point qui crée index.android.bundleest vraiment important pour ne pas utiliser de serveur de développement dans l'hôte.
Lee Elton

@ Mayur Balha: Vous pouvez vous reconnecter via usb ou wifi (connecté sur le même réseau). Pour le WiFi, reconnectez-vous au serveur dans votre application de réaction, secouez votre mobile sur l'émulateur, appuyez sur Win + R, puis cliquez sur les paramètres de développement. terminal entrez "ifconfig") comme 192.168.1.1:8080 puis appuyez à nouveau sur ok secouez ou appuyez sur Win + R pour l'émulateur, appuyez sur recharger maintenant, vous pouvez voir l'application se reconnecter au développement (cela ne fonctionnera que pour le débogage et non pour la version Apk).
Jeeva

29

Avec moi, dans le répertoire du projet, exécutez les commandes suivantes.

Pour l'ancienne version native de react (vous verrez index.android.js en root):

mkdir -p android/app/src/main/assets && rm -rf android/app/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 && cd android && ./gradlew clean assembleRelease && cd ../

Pour la nouvelle version native de react (vous voyez juste index.js en root):

mkdir -p android/app/src/main/assets && rm -rf android/app/build && 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 && cd android && ./gradlew clean assembleRelease && cd ../

Le fichier apk sera généré à l'adresse:

  • Gradle <3.0: android / app / build / sorties / apk /
  • Gradle 3.0+: android / app / build / sorties / apk / release /

pouvez-vous s'il vous plaît élaborer un peu et comment cela résout le problème?
Priyal

J'obtenais une erreur d'ouverture dans index.android.bundle et je l'ai résolu par votre suggestion. Merci ... :)
zephyr

6
Pour moi c'est$ mkdir -p android/app/src/main/assets && rm -rf android/app/build && 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 && cd android && ./gradlew assembleDebug
Arif

Fichier introuvable: index.android.js dans l'une des racines du projet
Anuj

1
Notez que --entry-file index.android.jsdoit être remplacé par --entry-file index.jspour les projets plus récents qui ont index.jsau lieu de index.android.jsdans la racine de leur répertoire de projet.
daka

8

Après avoir suivi la première réponse , vous pouvez exécuter votre application en utilisant

react-native run-android --variant=debug

Et votre application fonctionnera sans avoir besoin du conditionneur


1
la réponse la plus simple était la plus efficace depuis le début, cela fonctionnait sans faille, passait des jours à tester différentes lignes de commande et des tonnes de configurations js, et tout a été repris dans ceci
Nicolas Silva

4

À partir de react-native 0.57, aucune des réponses fournies précédemment ne fonctionnera plus, car les répertoires dans lesquels gradle s'attend à trouver le bundle et les actifs ont changé.

Méthode simple sans bundle natif de réaction

Le moyen le plus simple de créer une version de débogage est de ne pas utiliser la react-native bundlecommande du tout, mais simplement de modifier votre app/build.gradlefichier.

À l'intérieur de la project.ext.reactcarte dans le app/build.gradlefichier, ajoutez l' bundleInDebug: trueentrée. Si vous voulez que ce ne soit pas une --devconstruction (pas d'avertissements et de bundle minifié), vous devez également ajouter l' devDisabledInDebug: trueentrée à la même carte.

Avec bundle React-Native

Si, pour une raison quelconque, vous devez ou souhaitez utiliser la react-native bundlecommande pour créer le bundle, puis ./gradlew assembleDebugpour créer l'APK avec le bundle et les actifs, vous devez vous assurer de placer le bundle et les actifs dans les chemins corrects, là où gradle peut les trouver.

À partir de 0,57 natif de réaction, ces chemins sont android/app/build/generated/assets/react/debug/index.android.jspour le bundle

et android/app/build/generated/res/react/debugpour les actifs. Ainsi, les commandes complètes pour regrouper et créer manuellement l'APK avec le bundle et les actifs sont:

react-native bundle --dev false --platform android --entry-file index.js --bundle-output ./android/app/build/generated/assets/react/debug/index.android.bundle --assets-dest ./android/app/build/res/react/debug

puis

./gradlew assembleDebug

Chemin du bundle et des actifs

Notez que les chemins où gradle recherche le bundle et les actifs peuvent être sujets à changement. Pour savoir où se trouvent ces chemins, regardez le react.gradlefichier dans votre node_modules/react-nativerépertoire. Les lignes commençant par def jsBundleDir =et def resourcesDir =spécifient les répertoires dans lesquels gradle recherche respectivement le bundle et les actifs.


3

Pour les utilisateurs Windows si toutes les étapes ont bien suivi: https://facebook.github.io/react-native/docs/signed-apk-android.html

Vous devez uniquement exécuter: gradlew assembleRelease

Et votre fichier sera:

  • app-release.apk
  • app-release-unaligned.apk

Emplacement: E:\YourProjectName\android\app\build\outputs\apk


Vous pouvez installer / partager app-release.apk sur n'importe quel appareil
Dharam Mali

2
Habituellement, la version de débogage a une configuration différente de celle de la version de version (par exemple, elle utilise une API de préparation). Cela n'aide pas si vous voulez un APK autonome qui utilise une configuration de construction différente de la version
Josh

Cet APK est juste à des fins de développement / test.
Dharam Mali

3

Je suis sur React native 0.55.4, en gros, j'ai dû regrouper manuellement:

react-native bundle --dev false --platform android --entry-file index.js --bundle- 
output ./android/app/build/intermediates/assets/debug/index.android.bundle --assets- 
dest ./android/app/build/intermediates/res/merged/debug

Ensuite, connectez votre appareil via USB, activez le débogage USB. Vérifiez l'appareil connecté avec adb devices.

Enfin, exécutez react-native run-androidce qui installera l'apk de débogage sur votre téléphone et vous pourrez l'exécuter correctement avec le serveur de développement

Remarque:

  • À partir de 0.49.0, le point d'entrée est un seul index.js
  • gradlew assembleRelease génère uniquement les apks non signés qui ne peuvent pas être installés

3

Il peut être possible de générer une version apk non signée à des fins de test afin de pouvoir l'exécuter sur votre mobile.

Au départ, j'ai eu les erreurs d'écran rouge comme la plupart mentionnées ici. mais j'ai suivi la même chose qui a été mentionnée ici et cela a fonctionné pour moi.

Sur votre console à partir du répertoire de travail, exécutez ces quatre commandes

react-native bundle --dev false --platform android --entry-file index.js --bundle-output ./android/app/build/intermediates/assets/debug/index.android.bundle --assets-dest ./android/app/build/intermediates/res/merged/debug

cd android

gradlew assembleDebug

gradlew assembleRelease

Et puis le fichier APK produira sur: android \ app \ build \ sorties \ apk \ debug \ app-debug.apk


3

Juste au cas où quelqu'un d'autre se heurterait récemment au même problème, j'utilise React Native 0.59.8 (testé avec RN 0.60 également) et je peux confirmer certaines des autres réponses, voici les étapes:

  1. Désinstallez la dernière version compilée de votre application installée sur votre appareil

  2. Courir 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

  3. courir cd android/ && ./gradlew assembleDebug

  4. Obtenez votre app-debug.apk dans le dossier android / app / build / sorties / apk / debug

bonne chance!


1
Ne fonctionne pas !!!, il génère l'APK de débogage, mais l'application a toujours besoin du serveur de développement
aName

Cela ne peut pas fonctionner dans react-native 0.59.8, car gradle s'attend à ce que le bundle soit dans android/app/build/generated/assets/react/debug/index.android.jset que les actifs soient dans à android/app/build/generated/res/react/debugpartir de react-native 0.57.
TheBaj

Fonctionne très bien pour React Native 0.60>
Moso Akinyemi

0

J'ai trouvé une solution modifiant les buildTypes comme ceci:

buildTypes {
  release {
    signingConfig signingConfigs.release
  }
}
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.