una studio que nativa app android react-native

studio - Android no pudo cargar el paquete JS



que es una app nativa (23)

Estoy tratando de ejecutar AwesomeProject en mi Nexus5 (android 5.1.1).

Puedo construir el proyecto e instalarlo en el dispositivo. Pero cuando lo ejecuto, aparece una pantalla roja que dice

No se puede descargar el paquete JS. ¿Olvidó iniciar el servidor de desarrollo o conectar su dispositivo?

En iOS nativo, puedo elegir cargar jsbundle sin conexión. ¿Cómo puedo hacer lo mismo para Android? (O al menos, ¿dónde puedo configurar la dirección del servidor?)

Actualizar

Para ejecutar con el servidor local, ejecute los siguientes comandos en el directorio raíz del proyecto react-native

  1. react-native start > /dev/null 2>&1 &
  2. adb reverse tcp:8081 tcp:8081

Por favor, eche un vistazo a la respuesta de dsissitka para más detalles.

Para ejecutar sin un servidor, incluya el jsfile en el apk ejecutando:

  1. crear una carpeta de activos en android/app/src/main
  2. curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"

Por favor, eche un vistazo a la respuesta de kzzzf para más detalles.


¡Elimina la aplicación de tu teléfono! Intenté varios pasos, pero eso lo hice eventualmente.

  1. Si intentó ejecutar su aplicación antes pero falló, elimínela de su dispositivo Android.
  2. Ejecute $ react-native run-android
  3. Abra el menú React Rage Shake desde su aplicación en su dispositivo Android, vaya a Dev Settings y luego a Debug server host & port for device . Ingrese la IP de su servidor (IP de su computadora) y el host 8081 , por ejemplo 192.168.50.35:8081 . En una Mac, puede encontrar la IP de su computadora en System Preferences -> Network -> Advanced... -> TCP/IP -> IPv4 Address .
  4. Abra el menú Rage Shake nuevamente y haga clic en Reload JS .


Desde su directorio de proyecto, ejecute

react-native start

Produce lo siguiente:

$ react-native start ┌────────────────────────────────────────────────────────────────────────────┐ │ Running packager on port 8081. │ │ │ │ Keep this packager running while developing on any JS projects. Feel │ │ free to close this tab and run your own packager instance if you │ │ prefer. │ │ │ │ https://github.com/facebook/react-native │ │ │ └────────────────────────────────────────────────────────────────────────────┘ Looking for JS files in /home/user/AwesomeProject React packager ready. [11:30:10 PM] <START> Building Dependency Graph [11:30:10 PM] <START> Crawling File System [11:30:16 PM] <END> Crawling File System (5869ms) [11:30:16 PM] <START> Building in-memory fs for JavaScript [11:30:17 PM] <END> Building in-memory fs for JavaScript (852ms) [11:30:17 PM] <START> Building in-memory fs for Assets [11:30:17 PM] <END> Building in-memory fs for Assets (838ms) [11:30:17 PM] <START> Building Haste Map [11:30:18 PM] <START> Building (deprecated) Asset Map [11:30:18 PM] <END> Building (deprecated) Asset Map (220ms) [11:30:18 PM] <END> Building Haste Map (759ms) [11:30:18 PM] <END> Building Dependency Graph (8319ms)


Después de probar una combinación de las respuestas aquí, esto es lo que funciona para mí.

Estoy usando Genymotion como mi emulador.

1 Inicie el emulador Genymotion.

2 Desde una terminal

cd AwesomeProject react-native run-android # it loads in genymotion and fails with bundle error react-native start > /dev/null 2>&1 & # from dsissitka adb reverse tcp:8081 tcp:8081 # from dsissitka

3 Recargar desde el emulador.

Se carga!

Ahora puedo comenzar a desarrollar.


Ejecutar npm start desde el directorio react-native me funcionó.


En el nuevo React Native (seguro 0.59) la configuración de depuración está dentro de android/app/src/debug/res/xml/react_native_config.xml

<?xml version="1.0" encoding="utf-8"?> <network-security-config> <domain-config cleartextTrafficPermitted="true"> <domain includeSubdomains="false">localhost</domain> <domain includeSubdomains="false">10.0.2.2</domain> <domain includeSubdomains="false">10.0.3.2</domain> </domain-config> </network-security-config>


En la aplicación en Android, abrí Menú (Comando + M en Genymotion) -> Configuración de desarrollo -> Servidor de depuración host y puerto para dispositivo

establezca el valor en: localhost: 8081

Funcionó para mi.


Estaba obteniendo esto en Linux después de detener el proceso react-native run-android . Parece que el servidor de nodo todavía se está ejecutando, por lo que la próxima vez que lo ejecute, no se ejecutará correctamente y su aplicación no podrá conectarse.

La solución aquí es matar el proceso de nodo que se ejecuta en un Xterm que puede matar al controlar esa ventana (más fácil) o puede encontrarlo usando lsof -n -i4TCP:8081 luego kill -9 PID .

Luego ejecute react-native run-android nuevamente.


Este error puede resolverse fácilmente siguiendo estos pasos:

//run the command at /android sdk / platforms-tool folder adb reverse tcp:8081 tcp:8081 //now come to root folder of your app 1. npm start 2. create ''assets'' folder inside rootApp/android/app/src/main/ 3. curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle" 4. make sure anyone physical or virtual device attached is running. 5. react-native run-android


Estos son los pasos simples para ejecutar su aplicación en Android (versión):

1. Vaya a la raíz de su aplicación.

2. Ejecute este comando.

paquete react-native --plataforma android --dev falso --intry-file index.android.js --bundle-output android / app / src / main / assets / index.android.bundle --assets-dest android / app / src / main / res

Todos sus archivos se copian.

3. Crear APK firmado.

Abra el estudio de Android.

Compilación> Generar APK firmado> [Rellene los detalles requeridos, se debe generar una pulsación de tecla antes de este paso]

Su APK debe generarse sin ningún error. Instale en su dispositivo y esto debería funcionar sin ningún problema.

También puede conectar su dispositivo y presionar directamente el ícono Ejecutar en el estudio de Android para realizar pruebas.

Generando pulsación de tecla:

  1. Ir a C: / Archivos de programa / Java / jdkx.x.x_x / bin

  2. correr

keytool -genkey -v -keystore d: / my_private_key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validez 10000

Probablemente le pedirá que complete algunos detalles. Hágalo y tendrá su archivo de pulsación de tecla ( my_private_key.keystore ) que se puede usar para firmar su apk.


Estoy usando Ubuntu y Android solamente, y no pude hacerlo funcionar. Encontré una solución realmente simple que es actualizar su archivo package.json, cambiando estas líneas:

"scripts": { "start": "node node_modules/react-native/local-cli/cli.js start" },

a

"scripts": { "start": "adb reverse tcp:8081 tcp:8081 && node node_modules/react-native/local-cli/cli.js start" },

Y luego ejecutas el servidor escribiendo

npm run start

Esto garantiza que el dispositivo Android busque el servidor de nodo en su computadora en lugar de localmente en el teléfono.


Inicie los dos terminales en el mismo y el primer terminal ejecute react-native start y el segundo terminal react-native run-android este problema se resuelve de manera simple. Y la mejor de las suertes


La pregunta inicial fue sobre la recarga de la aplicación en un dispositivo físico.

Cuando está depurando la aplicación en un dispositivo físico (es decir, a través de adb), puede volver a cargar el paquete JS haciendo clic en el botón de "acción" superior izquierdo de su dispositivo. Esto abrirá el menú de opciones (Recargar, Depurar JS de forma remota ...).

Espero que esto ayude.


Lo siguiente me hizo funcionar en Ubuntu 14.04:

cd (App Dir) react-native start > /dev/null 2>&1 & adb reverse tcp:8081 tcp:8081

Actualización : ver

Actualización 2 : @scgough Recibimos este error porque React Native (RN) no pudo obtener JavaScript del servidor de desarrollo que se ejecuta en nuestras estaciones de trabajo. Puedes ver por qué sucede esto aquí:

https://github.com/facebook/react-native/blob/42eb5464fd8a65ed84b799de5d4dc225349449be/ReactAndroid/src/main/java/com/facebook/react/devsupport/DevServerHelper.java#L116-L137

Si su aplicación RN detecta que está utilizando Genymotion o el emulador, intenta obtener el JavaScript de GENYMOTION_LOCALHOST (10.0.3.2) o EMULATOR_LOCALHOST (10.0.2.2). De lo contrario, se supone que está utilizando un dispositivo e intenta recuperar el JavaScript de DEVICE_LOCALHOST (localhost). El problema es que el servidor de desarrollo se ejecuta en el host local de su estación de trabajo, no en el dispositivo, por lo que para que funcione, debe:


No tengo suficiente reputación para comentar, pero esto se refiere a la respuesta de dsissitka. Funciona también en Windows 10.

Para reiterar, los comandos son:

cd (App Dir) react-native start > /dev/null 2>&1 & adb reverse tcp:8081 tcp:8081


Ok, creo que he descubierto cuál es el problema aquí. Tenía que ver con la versión de watchman que estaba ejecutando.

En un nuevo shell, ejecute brew update luego: brew unlink watchman luego: brew install watchman

ahora puede ejecutar react-native start desde su carpeta de proyecto

Dejo este shell abierto, creo una nueva ventana de shell y ejecuto: react-native run-android desde mi carpeta de proyecto. Todo esta bien con el mundo.

PD. Originalmente estaba en la versión 3.2 de watchman. Esto me actualizó a 3.7.

pps. Soy nuevo en esto, por lo que podría no ser la ruta más rápida hacia la solución, pero me ha funcionado.

* MÁS INFORMACIÓN PARA EJECUTAR / DEPURAR EN UN DISPOSITIVO *

Es posible que si implementa su aplicación en su dispositivo Android en lugar de un emulador, obtiene una pantalla roja de la muerte con un error que dice Unable to load JS Bundle . Debe configurar el servidor de depuración para que su dispositivo funcione con su computadora. Reaccione ... ya sea su nombre O dirección IP.

  1. Presione el botón Menu del dispositivo
  2. Seleccionar Dev Settings
  3. Seleccione el Debug server host for device
  4. Escriba la IP de su máquina y vuelva a cargar JS más el puerto de reacción, por ejemplo 192.168.1.10:8081

Más información: http://facebook.github.io/react-native/docs/running-on-device-android.html


Para agrupar el archivo JS en su apk mientras hace que su servidor se ejecute ( react-native start ) descargue el paquete en el directorio de activos de su aplicación:

curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"

Con la próxima versión (0.12) arreglaremos el comando react-native bundle para que funcione con proyectos de Android como se esperaba.


Puede seguir las instrucciones mencionadas en la página oficial para solucionar este problema. Este problema ocurre en un dispositivo real porque el paquete JS se encuentra en su sistema de desarrollo y la aplicación dentro de su dispositivo real no es consciente de su ubicación.


Una actualización

Ahora en Windows no es necesario ejecutar start-native react. El empaquetador se ejecutará automáticamente.


Una cosa importante para verificar que nadie ha mencionado hasta ahora: Verifique su firewall local, asegúrese de que esté APAGADO .

Vea mi respuesta aquí: https://.com/a/41400708/1459275


Una solución fácil que funciona para mí con Ubuntu 14.04.

react-native run-android

El emulador (ya lanzado) devolverá: No se puede descargar JS Bundle; iniciar de nuevo el servidor JS:

react-native start

Pulsa Reload JS en el emulador. Funcionó para mi. Espero que ayude


Verifica tu conexión wifi.

Otra posibilidad podría ser que no esté conectado a wifi, conectado a la red incorrecta o que la dirección IP sea incorrecta en la configuración de desarrollo. Por alguna razón, mi Android se desconectó del wifi y comencé a recibir este error, sin saberlo.


Corriendo en el dispositivo

He encontrado otra respuesta.

  • adb reverse: solo funciona en Android 5.0+ (API 21).
  • Otro: abra el menú Desarrollador agitando el dispositivo, vaya a Configuración de desarrollo , Vaya a Host del servidor de depuración para el dispositivo , escriba la dirección IP de su máquina y el puerto del servidor de desarrollo local