React Native Client SDK
Importante
Visual Studio App Center está programado para su retirada el 31 de marzo de 2025. Aunque puede seguir usando Visual Studio App Center hasta que se retire por completo, hay varias alternativas recomendadas a las que puede considerar la posibilidad de migrar.
Obtenga más información sobre las escalas de tiempo de soporte técnico y las alternativas.
Este complemento proporciona integración del lado cliente para el servicio CodePush, lo que le permite agregar fácilmente una experiencia de actualización dinámica a las aplicaciones de React Native.
¿Cómo funciona?
Las aplicaciones de React Native se componen de archivos JavaScript y de las imágenes asociadas, agrupadas por el empaquetador y distribuidas como parte de un binario específico de la plataforma (un .ipa archivo o .apk ). Cuando se publica la aplicación, actualizar el código JavaScript (por ejemplo, realizar correcciones de errores, agregar nuevas características) o recursos de imagen, requiere que vuelva a compilar y redistribuir todo el binario, lo que incluye cualquier tiempo de revisión para las tiendas en las que está publicando.
El complemento CodePush ayuda a obtener mejoras de producto delante de los usuarios finales al instante, manteniendo sincronizadas las imágenes y JavaScript con las actualizaciones que publique en el servidor CodePush. De este modo, la aplicación obtiene las ventajas de una experiencia móvil sin conexión, así como la agilidad "similar a la web" de las actualizaciones de carga local tan pronto como estén disponibles.
Para asegurarse de que los usuarios finales siempre tienen una versión en funcionamiento de la aplicación, el complemento CodePush mantiene una copia de la actualización anterior, de modo que, en caso de que inserte accidentalmente una actualización que incluya un bloqueo, puede revertirse automáticamente. De este modo, puede estar seguro de que la agilidad de lanzamiento de la nueva versión no dará lugar a que los usuarios se bloqueen antes de tener la oportunidad de revertir en el servidor.
Nota:
Cualquier cambio en el producto que toque código nativo (por ejemplo, modificar el archivo AppDelegate.m/MainActivity.java, agregar un nuevo complemento) no se puede distribuir a través de CodePush, por lo que debe actualizarse a través de los almacenes adecuados.
Plataformas nativas de React compatibles
- iOS (7+)
- Android (5.0+)
- Windows (UWP)
Intentamos mantener la compatibilidad con versiones anteriores de nuestro complemento con versiones anteriores de React Native, pero debido a la naturaleza de la plataforma, y la existencia de cambios importantes entre versiones, es posible que necesite usar una versión específica del complemento CodePush para admitir la versión exacta de React Native que está usando. En la tabla siguiente se describe qué versiones del complemento CodePush admiten oficialmente las respectivas versiones de React Native:
| Versiones nativas de React | Compatibilidad con versiones de CodePush |
|---|---|
| <0.14 | No admitidas |
| v0.14 | v1.3 (se introdujo la compatibilidad con Android) |
| v0.15-v0.18 | v1.4-v1.6 (se introdujo la compatibilidad con recursos de iOS) |
| v0.19-v0.28 | v1.7-v1.17 (se introdujo la compatibilidad con recursos de Android) |
| v0.29-v0.30 | v1.13-v1.17 (código de hospedaje nativo refactorizado de RN) |
| v0.31-v0.33 | v1.14.6-v1.17 (código de hospedaje nativo refactorizado de RN) |
| v0.34-v0.35 | v1.15-v1.17 (código de hospedaje nativo refactorizado de RN) |
| v0.36-v0.39 | v1.16-v1.17 (controlador de reanudación refactorizado de RN) |
| v0.40-v0.42 | v1.17 (archivos de encabezado de iOS refactorizado de RN) |
| v0.43-v0.44 | v2.0+ (dependencias de uimanager refactorizado de RN) |
| v0.45 | v3.0+ (código de administrador de instancias refactorizado de RN) |
| v0.46 | v4.0+ (código del cargador de paquetes js refactorizado de RN) |
| v0.46-v0.53 | v5.1+ (RN quitó el registro sin usar de los módulos de JS) |
| v0.54-v0.55 | v5.3+ (integración de Android Gradle Plugin 3.x) |
| v0.56-v0.58 | v5.4+ (versiones actualizadas de RN para herramientas de Android) |
| v0.59 | v5.6+ (código del cargador de paquetes js refactorizado de RN) |
| v0.60-v0.61 | v6.0+ (RN migrado a Autolinking) |
Trabajamos duro para responder a las nuevas versiones de React Native, pero en ocasiones nos rompen. Actualizaremos este gráfico con cada versión de React Native para que los usuarios puedan comprobar cuál es nuestro soporte técnico oficial.
Componentes admitidos
Al usar el sistema de recursos de React Native (como usar la require("./foo.png") sintaxis), la siguiente lista representa el conjunto de componentes principales (y propiedades) que admiten la actualización de sus imágenes y vídeos a los que se hace referencia a través de CodePush:
| Componente | Propiedades |
|---|---|
Image |
source |
MapView.Marker (Requiere react-native-maps >=O.3.2) |
image |
ProgressViewIOS |
progressImage, trackImage |
TabBarIOS.Item |
icon, selectedIcon |
ToolbarAndroid (React Native 0.21.0+) |
actions[].icon, , logo, overflowIcon |
Video |
source |
La lista siguiente representa el conjunto de componentes (y propiedades) que actualmente no admiten que sus recursos se actualicen a través de CodePush, debido a su dependencia de imágenes y vídeos estáticos (como el uso de la { uri: "foo" } sintaxis):
| Componente | Propiedades |
|---|---|
SliderIOS |
maximumTrackImage, minimumTrackImage, , thumbImage, trackImage |
Video |
source |
Esta lista se actualizará a medida que se publiquen nuevos componentes principales, que admiten la referencia a recursos, para asegurarse de que los usuarios sepan exactamente qué pueden esperar actualizar mediante CodePush.
Nota:
CodePush solo funciona con componentes de vídeo cuando se usa require en la propiedad de origen. Por ejemplo:
<Video source={require("./foo.mp4")} />
Cumplimiento de directrices de la Tienda
Aunque Google Play y las aplicaciones distribuidas internamente (por ejemplo, Enterprise, Fabric, App Center) no tienen limitaciones sobre cómo publicar actualizaciones mediante CodePush, la App Store de iOS y sus directrices correspondientes tienen reglas más precisas que debe tener en cuenta antes de integrar la solución dentro de la aplicación.
El Contrato de licencia del Programa para desarrolladores de Apple, en virtud del párrafo 3.3.2, permite actualizaciones inalámbricas de JavaScript y activos, y en su versión más reciente (20210607) descargable aquí esta decisión es aún más amplia:
El código interpretado se puede descargar en una aplicación, pero solo siempre que este código: (a) no cambie el propósito principal de la aplicación proporcionando características o funcionalidades que sean incoherentes con el propósito previsto y anunciado de la aplicación tal como se envía a App Store, (b) no crea un almacén ni escaparate para otro código o aplicación, y (c) no omite la firma, el espacio aislado ni otras características de seguridad del sistema operativo.
CodePush le permite seguir estas reglas de cumplimiento total siempre que la actualización que inserte no desvíe significativamente el producto de su intención aprobada original de App Store.
Para seguir cumpliendo las directrices de Apple, se recomienda que las aplicaciones distribuidas por App Store no habiliten la updateDialog opción al llamar a sync, ya que en las Directrices de revisión de App Store se escribe que:
Las aplicaciones no deben obligar a los usuarios a evaluar la aplicación, revisar la aplicación, descargar otras aplicaciones u otras acciones similares para acceder a la funcionalidad, el contenido o el uso de la aplicación.
Esto no es necesariamente el caso de updateDialog, ya que no obligará al usuario a descargar la nueva versión, pero al menos debe tener en cuenta esa decisión si decide mostrarla.
Aplicaciones de ejemplo/Iniciadores
La comunidad de React Native ha creado de forma graciosa algunas aplicaciones impresionantes de código abierto que pueden servir como ejemplos para los desarrolladores que se están iniciando. La lista siguiente es de aplicaciones nativas de OSS React que también usan CodePush y se pueden usar para ver cómo otros usan el servicio:
- Aplicación F8: aplicación de conferencia oficial para F8 2016.
- Feline para Product Hunt : un cliente Android para Product Hunt.
- GeoEncoding : una aplicación de Lynx IT Digital, que muestra cómo usar numerosos componentes y módulos nativos de React.
- Hechos matemáticos : una aplicación de Khan Academy para ayudar a memorizar los hechos matemáticos más fácilmente.
Además, si quiere empezar a trabajar con React Native + CodePush y busca un kit de inicio impresionante, debe consultar lo siguiente:
-
Nota:
Si ha desarrollado una aplicación de React Native con CodePush, es de código abierto, háganoslo saber. ¡Nos encantaría agregarlo a esta lista!
Integración continua/entrega
Además de usar la CLI de CodePush para "manualmente" las actualizaciones de versión, creemos que es importante crear una solución repetible y sostenible para entregar continuamente actualizaciones a la aplicación. De este modo, es lo suficientemente sencillo como para que usted o su equipo creen y mantengan el ritmo de las implementaciones ágiles. Para ayudar a configurar una canalización de CD basada en CodePush, consulte las siguientes integraciones con varios servidores de CI:
- Azure DevOps : Azure DevOps (anteriormente conocido como VSTS) también tiene extensiones para publicar en App Center y Google Play Store, por lo que proporciona una solución de CD móvil bastante excelente en general.
- Travis CI
Consumo de TypeScript
Este módulo envía su *.d.ts archivo como parte de su paquete NPM, que le import permite, y recibe intellisense en editores auxiliares (como Visual Studio Code), así como la comprobación de tipos en tiempo de compilación si usa TypeScript. En la mayor parte, este comportamiento debe funcionar de forma predeterminada, sin embargo, si ha especificado es6 como valor para la target opción del compilador o module en el archivo, asegúrese de que también establezca la moduleResolution opción nodeen tsconfig.json . Esto garantiza que el compilador de TypeScript buscará en las node_modules definiciones de tipo de los módulos importados. De lo contrario, obtendrá un error similar al siguiente al intentar importar el react-native-code-push módulo: error TS2307: Cannot find module 'react-native-code-push'.