Saltar al contenido principal

React Native 0.72: Soporte para enlaces simbólicos, mejores errores y más

· 9 min de lectura
Lorenzo Sciandra
Lorenzo Sciandra
Senior Software Engineer @ Microsoft
Marek Fořt
Marek Fořt
Software Engineer @ Shopify
Riccardo Cipolleschi
Riccardo Cipolleschi
Software Engineer @ Meta
Luna Wei
Luna Wei
Software Engineer @ Meta
Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

¡Hoy lanzamos la versión 0.72!

Esta versión incluye funciones muy solicitadas para Metro, mejor manejo de errores y otras mejoras en la experiencia de desarrollo. Gran parte de este trabajo se priorizó gracias a sus comentarios en la encuesta comunitaria 2022. ¡Gracias a todos los que participaron!

Lo más destacado​

Cambios importantes​

Lo más destacado​

Nuevas funciones de Metro​

Soporte para enlaces simbólicos (Beta)​

El soporte para enlaces simbólicos sigue siendo una de las funciones más solicitadas en Metro. En React Native 0.72, nos complace anunciar su versión beta.

Esta función permite que React Native funcione transparentemente con configuraciones de monorepos y pnpm, eliminando la necesidad de soluciones alternativas. Consulta Habilitar funciones beta para usarla en tu aplicación.

Actualmente está en fase beta para recopilar comentarios sobre la experiencia de desarrollo en diferentes flujos de trabajo. Más detalles aquí. Planeamos habilitar los enlaces simbólicos por defecto en la versión 0.73.

Soporte para Exportaciones de Paquetes (Beta)​

Package Exports es la alternativa moderna al campo "main" en package.json, que permite a los paquetes npm definir su API pública y orientarse a React Native.

Al habilitar esta función en tu configuración de Metro, tu aplicación será compatible con el ecosistema JavaScript más amplio, incluyendo la nueva "condición comunitaria react-native". Consulta Habilitar funciones beta para usarla.

consejo

Consulta Soporte para Exportaciones de Paquetes en React Native para conocer más sobre esta función y nuestros planes de implementación estable.

Habilitar funciones beta​

Para habilitar estas funciones en tu proyecto, actualiza el archivo metro.config.js de tu aplicación y configura las opciones resolver.unstable_enableSymlinks o resolver.unstable_enablePackageExports.

const config = {
  // ...
  resolver: {
    unstable_enableSymlinks: true,
    unstable_enablePackageExports: true,
  },
};

Nueva configuración de metro.config.js​

En React Native 0.72, hemos modificado la configuración de carga de Metro en React Native CLI. Actualiza el archivo metro.config.js de tu proyecto para que coincida con la versión de la plantilla.

información

Actualiza tu archivo de configuración al siguiente formato. También puedes seguir el upgrade-helper.

Estos cambios de formato en metro.config.js serán obligatorios en la versión 0.73. Para la 0.72, mostraremos una advertencia si no se actualiza.

Esto transfiere el control sobre la extensión de la configuración base de Metro para React Native a tu proyecto, y hemos limpiado los valores predeterminados residuales. Además, significa que comandos independientes de Metro CLI, como metro get-dependencies, ahora funcionarán.

Mejoras en la Experiencia del Desarrollador​

Adiós a las redboxes con propiedades de estilo inválidas​

Antes de esta versión, proporcionar una propiedad de estilo inválida en StyleSheet resultaba en una redbox. Este error de alta intensidad interrumpía el flujo de trabajo del desarrollador por un error de relativamente bajo riesgo.

En la 0.72, hemos relajado esta expectativa para que falle silenciosamente, como ocurre al proporcionar una propiedad CSS inválida en el navegador, y actualizamos los tipos para que algunos errores puedan detectarse en tiempo de compilación en lugar de en tiempo de ejecución.

Mejor legibilidad de errores en Hermes​

Hermes ahora muestra mensajes de error más claros al invocar un elemento invocable no definido.

    var x = undefined; x();
    // Before: undefined is not a function
    // After: x is not a function (it is undefined)

Además, los seguimientos de pila de LogBox ahora filtran los marcos internos de bytecode de Hermes que no son relevantes para los usuarios de la aplicación.

Mejoras en la salida de errores de React Native CLI​

La versión 0.72 incluye React Native CLI v11 con mejoras para reducir duplicaciones, clarificar redacción, disminuir seguimientos de pila verbosos y añadir enlaces profundos a documentación relevante en los comandos init, run-android y run-ios.

Puedes encontrar otras mejoras en los registros de cambios de React Native CLI.

Compilación más rápida y análisis JSON en Hermes​

Hermes ha mejorado el tiempo de compilación de literales de objetos grandes. Por ejemplo, en un caso reportado (#852), un usuario tenía un conjunto completo de datos escrito como un gran literal de objeto. Al optimizar el algoritmo de desduplicación de Hermes, la compilación se aceleró un 97% (221c). Estas mejoras beneficiarán los tiempos de compilación de aplicaciones que agrupan muchos objetos.

También se implementaron múltiples optimizaciones (de9c, 6e2d) para el análisis JSON, beneficiando a aplicaciones que usan bibliotecas como redux-persist que dependen en gran medida de la manipulación JSON.

Mayor soporte ECMAScript en Hermes​

React Native 0.72 incluye soporte en Hermes para las siguientes especificaciones:

Para usuarios de JSC, estas características ya están disponibles.

Actualizaciones sobre la Nueva Arquitectura​

La Nueva Arquitectura sigue siendo experimental. Para mantener las actualizaciones enfocadas en su público objetivo, a partir de 0.72 moveremos las novedades al grupo de trabajo. Esto también permitirá actualizaciones más frecuentes, como el trabajo incluido en nuestras versiones nocturnas.

Puedes leer las actualizaciones de 0.72 para la Nueva Arquitectura aquí. Suscríbete a las notificaciones del grupo de trabajo en GitHub para mantenerte informado del progreso.

Cambios importantes​

Eliminación de componentes obsoletos​

Los siguientes paquetes se han eliminado de React Native en 0.72. Migra a las alternativas recomendadas de la comunidad:

Cambios de nombre en paquetes​

Todos los paquetes publicados desde el repositorio principal react-native ahora están en react-native/packages y se publican bajo el ámbito @react-native en npm para clarificar su procedencia.

No hay cambios en el paquete principal react-native.

Old Package NameNew Package Name
@react-native-community/eslint-config@react-native/eslint-config
@react-native-community/eslint-plugin@react-native/eslint-plugin
@react-native/polyfills@react-native/js-polyfills
@react-native/normalize-color@react-native/normalize-colors
@react-native/assets@react-native/assets-registry
react-native-codegen@react-native/codegen
react-native-gradle-plugin@react-native/gradle-plugin

Este cambio no te afectará si no dependes directamente de paquetes renombrados. Si es tu caso, al actualizar a React Native 0.72, actualiza cualquier dependencia renombrada a su versión ~0.72.

Puedes leer la motivación detrás de estos cambios en la RFC dedicada.

Agradecimientos​

Gran parte de esta versión surgió de los comentarios directos de la comunidad. Desde reportes sobre redboxes ruidosas, errores con Package Exports, benchmarks para la Nueva Arquitectura — todo es valioso de escuchar y agradecemos el tiempo que toma compartir comentarios.

La versión 0.72 contiene más de 1100 commits de 66 colaboradores. ¡Gracias por todo su arduo trabajo!

Actualización a la versión 0.72​

Consulta la lista de cambios necesarios en el upgrade-helper, o lee la documentación de actualización para saber cómo actualizar tu proyecto existente o crear uno nuevo con npx react-native@latest init MyProject.

Si usas Expo, la versión 0.72 de React Native será compatible con el lanzamiento de Expo SDK 49.

información

0.72 es ahora la última versión estable de React Native y la versión 0.69.x pasa a ser no compatible. Para más información, consulta la política de soporte de React Native.