¿Cómo usar el bundle offline en android para reaccionar al proyecto nativo?

¿Cómo usar el paquete sin conexión en android?
No vi el documento sobre el uso de paquetes sin conexión en android.
Intenté descomentar el código en build.gradle.

project.ext.react = [ // the name of the generated asset file containing your JS bundle bundleAssetName: "index.android.bundle", // the entry file for bundle generation entryFile: "index.android.js", // whether to bundle JS and assets in debug mode bundleInDebug: false, // whether to bundle JS and assets in release mode bundleInRelease: true, // the root of your project, ie where "package.json" lives root: "../../", // where to put the JS bundle asset in debug mode jsBundleDirDebug: "$buildDir/intermediates/assets/debug", // where to put the JS bundle asset in release mode jsBundleDirRelease: "$buildDir/intermediates/assets/release", // where to put drawable resources / React Native assets, eg the ones you use via // require('./image.png')), in debug mode resourcesDirDebug: "$buildDir/intermediates/res/merged/debug", // where to put drawable resources / React Native assets, eg the ones you use via // require('./image.png')), in release mode resourcesDirRelease: "$buildDir/intermediates/res/merged/release", // by default the gradle tasks are skipped if none of the JS files or assets change; this means // that we don't look at files in android/ or ios/ to determine whether the tasks are up to // date; if you have any other folders that you want to ignore for performance reasons (gradle // indexes the entire tree), add them here. Alternatively, if you have JS files in android/ // for example, you might want to remove it from here. inputExcludes: ["android/**", "ios/**"] ]

Pero no funcionó. Todavía busco el paquete JS desde el servidor.
¿Hay algo que me perdí?

Para la agrupación offline de JS en android, primero inicie el servidor en la ruta de proyecto respectiva:

Al iniciar el servidor, abra el siguiente terminal con la misma ruta que la ruta del proyecto
Copie y pegue este comando: Antes de copiar y pegar el comando en el comando propmt, haga la carpeta de los activos en el sendero respectivo del proyecto
como:
Android / app / src / main / assets

Pegue este comando en el símbolo del sistema y ejecute:
```
  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/ 
```
A continuación, en la carpeta de activos aparecerá el archivo como index.android.bundle
Por último, ejecute comando: reaccionar-nativo run-android (mientras que la construcción de nuevo apk fuera de línea no es necesario para iniciar el servidor, su archivo js sin conexión le ayudará a construir el archivo apk.)
Final, apk now build está listo para ejecutarse en diferentes dispositivos (ejecute apk desde app / src / build / debug.apk).
Si la aplicación se ejecuta sin imagen, copie y pegue la carpeta de recursos de imagen específica en android / app / src / main / assets / (carpeta de la fuente de la imagen)
Una vez más volver a ejecutar la aplicación y, por tanto, construir apk está listo para ejecutarse.

Usted puede leer el código fuente de react.gradle , entonces usted sabrá cómo hacer el paquete sin conexión.

En react.gradle , crea tarea de gradle de paquetes sin conexión para cada variante de compilación y lo hace ejecutar antes de los recursos del proceso gradle, pero permite que la tarea del paquete en algunas condiciones especiales, el código sea:

 enabled config."bundleIn${targetName}" || config."bundleIn${buildTypeName.capitalize()}" ?: targetName.toLowerCase().contains("release")

Mientras que el objeto config es el objeto react realidad como su definición es def config = project.hasProperty("react") ? project.react : []; def config = project.hasProperty("react") ? project.react : [];

Y la definición targetName es def targetName = "${productFlavorName.capitalize()}${buildTypeName.capitalize()}"

Así que si definimos una propiedad de react adecuada en app\build.gradle , podemos habilitar la tarea del paquete sin conexión.

Por ejemplo, si queremos habilitar el paquete sin conexión en el tipo de compilación de release pero no en el tipo de compilación de debug , podemos definir el react como:

 ext.react = [ bundleInDebug : false, bundleInRelease : true ]

Entonces ejecute el gradle assembleRelease en la línea de comando, gradle ejecutará la tarea del paquete y el paquete de js será incluido en apk final.

Ahora en su pregunta, ha definido el objeto de react adecuado, pero no menciona qué tipo de compilación ha ejecutado. Sólo ejecutar gradle assembleRelease puede hacer el trabajo de paquete, tal vez ejecutó gradle assembleDebug por lo que no tiene sentido.

Y todavía hay otro problema que debo decir (véase también el número 7258 ). Si activaste la tarea del paquete para el tipo de compilación de lanzamiento y ejecuta la aplicación desde android studio, gradle no ejecuta bundleReleaseJsAndAssets , porque android studio habilita la característica Configure on demand (está en el archivo | Configuración | Compilación, Ejecución, Implementación | Para acelerar la compilación y en react.gradle la tarea del paquete se agrega al proyecto cuando todo el proyecto está configurado (o llamado evaluado) como el código principal está en el bloque gradle.projectsEvaluated{} .

La configuración en modo de demanda intenta configurar sólo los proyectos que son relevantes para las tareas solicitadas, es decir, sólo ejecuta el archivo build.gradle de los proyectos que participan en la compilación.

Por algunas razones poco claras, cualquier tarea definida en el bloque gradle.projectsEvaluated{} no se ejecuta cuando habilita la función Configure on demand . Para hacerlo ejecutable, desactive la función Configure on demand la Configure on demand android studio o cambie gradle.projectsEvaluated{} a afterEvaluate{} .

Si ejecuta el gradle assembleRelease en la herramienta de línea de comandos, todo está bien porque la Configure on demand está desactivada de forma predeterminada.

No tiene que descomentar nada en su archivo gradle.build. Está allí para la referencia y usted puede sobrescribir cualesquiera de los valores que están allí como defaults si usted necesita a.

El problema es que Android Studio no está ejecutando la tarea que es responsable de generar el paquete.

Para solucionarlo en Android Studio, vaya a Preferences > Build, Execution, Deployment > Build Tools > Compiler y desmarque "Configure on demand" .

Ahora, cualquier variante que marca como requisito de paquete, tendrá el paquete generado automáticamente.

De forma predeterminada, la variante de depuración no obtiene el paquete generado: bundleInDebug : false

Puedes cambiar eso así. Aquí también proporcioné un ejemplo de cómo cambiar la ubicación predeterminada del punto de entrada y el nombre predeterminado del paquete.

 project.ext.react = [ bundleAssetName: "index.myapp.bundle", entryFile: "js/index.myapp.js", bundleInDebug: true ]

Una vez que realice estos ajustes, puede seguir sintonizándose en el desarrollo de problemas porque Studio no reconoce las rutas de sus perfiles de shell, por lo que puede que no encuentre la ruta al nodo.

He publicado una solución a este problema aquí

Esta es una solución estable y robusta. Usted no tiene que hacer nada manualmente una vez que realice estos cambios en su env. El paquete se creará automáticamente al presionar los botones de su IDE, otorgándole que seleccione las variantes de construcción adecuadas (que también se encuentran en IDE en la barra LHS de la ventana de Studio hacia la parte inferior).

Para liberación con un APK firmado.

Intenté usar un archivo APK no firmado e instalarlo, pero cuando lo Failure [INSTALL_PARSE_FAILED_NO_CERTIFICATES] en mi tablet Android, me dio un error de Error Failure [INSTALL_PARSE_FAILED_NO_CERTIFICATES] .

Me imagino que esto es porque el archivo APK no estaba firmado y la tableta no estaba contento con esto. Así que, después de generar el archivo de paquete React Native, pude generar un archivo APK firmado, como es normal, a través de Android Studio.

Por cierto, nuestra aplicación es una aplicación para Android completamente funcional que ya existe en Play Store y estamos agregando React Native a ella en pedazos de tamaño de mordedura, porque es impresionante.

Así que para resumir, he aquí mis pasos:

1) Generar React Native bundle:

 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) Genere un archivo APK firmado desde Android Studio.

3) Instale el archivo APK firmado en el dispositivo USB:

 adb -d install -r <path_to_signed_apk>

4) ¡Beneficio!

Puede anular la función getJSBundleFile () en su clase ReactApplication para devolver una ruta de archivo personalizada.

 @Nullable @Override protected String getJSBundleFile() { return "/your/bundle/path/bundle.file.name.bundle"; }

Después de eso, sólo genere el paquete utilizando el paquete react-native bundle , luego coloque el paquete generar en la ruta especificada en su dispositivo.