Anunciamos React Native 0.62 con Flipper

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 React Native versión 0.62 que incluye soporte para Flipper de forma predeterminada.

Este lanzamiento ocurre en medio de una pandemia global. Publicamos esta versión hoy para respetar el trabajo de cientos de colaboradores que hicieron posible este lanzamiento y evitar que quede demasiado rezagado respecto a la rama principal. Por favor, consideren la capacidad reducida de los colaboradores para ayudar con problemas y prepárense para retrasar la actualización si es necesario.

Flipper por defecto

Flipper es una herramienta de desarrollo para depurar aplicaciones móviles. Es popular en las comunidades de Android e iOS, y en esta versión hemos habilitado su soporte por defecto para aplicaciones nuevas y existentes de React Native.

Flipper proporciona las siguientes funciones listas para usar:

• Acciones de Metro: Recarga la aplicación y activa el Menú de Desarrollo desde la barra de herramientas.

• Reporte de Fallos: Visualiza informes de fallos desde dispositivos Android e iOS.

• React DevTools: Usa la versión más reciente de React DevTools junto con todas tus otras herramientas.

• Inspector de Red: Visualiza todas las solicitudes de red realizadas por las aplicaciones del dispositivo.

• Registros de Metro y Dispositivo: Visualiza, busca y filtra todos los registros tanto de Metro como del dispositivo.

• Inspector de Diseño Nativo: Visualiza y edita el diseño nativo generado por el renderizador de React Native.

• Inspectores de Base de Datos y Preferencias: Visualiza y edita las bases de datos y preferencias del dispositivo.

Adicionalmente, dado que Flipper es una plataforma extensible, proporciona un mercado que obtiene plugins de NPM para que puedas publicar e instalar plugins personalizados específicos para tus flujos de trabajo. Consulta los plugins disponibles aquí.

Para más información, visita la documentación de Flipper.

Nuevas funciones para modo oscuro

Hemos añadido un nuevo módulo Appearance para proporcionar acceso a las preferencias de apariencia del usuario, como su esquema de color preferido (claro u oscuro).

const colorScheme = Appearance.getColorScheme();
if (colorScheme === 'dark') {
  // Use dark color scheme
}

También hemos añadido un hook para suscribirse a actualizaciones de estado de las preferencias del usuario:

import {Text, useColorScheme} from 'react-native';

const MyComponent = () => {
  const colorScheme = useColorScheme();
  return <Text>useColorScheme(): {colorScheme}</Text>;
};

Consulta la documentación de Appearance y useColorScheme para más información.

Traslado de Apple TV a react-native-tvos

Como parte de nuestro esfuerzo Lean Core y para alinear Apple TV con otras plataformas como React Native Windows y React Native macOS, hemos comenzado a eliminar el código específico de Apple TV del núcleo.

De ahora en adelante, el soporte para Apple TV en React Native se mantendrá en react-native-community/react-native-tvos junto con el paquete NPM correspondiente react-native-tvos. Este es un fork completo del repositorio principal, con solo los cambios necesarios para soportar Apple TV.

Los lanzamientos de react-native-tvos se basarán en la versión pública de React Native. Para este lanzamiento 0.62 de react-native, actualiza los proyectos de Apple TV para usar react-native-tvos 0.62.

Más soporte para actualizaciones

Cuando se lanzó la versión 0.61, la comunidad presentó una nueva herramienta de asistente de actualización para ayudar a los desarrolladores a actualizar a nuevas versiones de React Native. El asistente muestra un diff de cambios desde tu versión actual hasta la versión objetivo, permitiéndote ver los cambios necesarios para tu actualización específica.

Incluso con esta herramienta, surgen problemas al actualizar. Hoy presentamos más soporte dedicado para actualizaciones al anunciar Upgrade-Support. Upgrade Support es un rastreador de problemas de GitHub donde los usuarios pueden enviar problemas específicos sobre la actualización de sus proyectos para recibir ayuda de la comunidad.

Siempre estamos trabajando para mejorar la experiencia de actualización, y esperamos que estas herramientas brinden a los usuarios el soporte que necesitan en casos extremos que aún no hemos cubierto.

Otras mejoras

• LogBox: Estamos agregando la nueva experiencia de errores y advertencias de LogBox como opción; para habilitarla, añade require('react-native').unstable_enableLogBox() a tu archivo index.js.

• React DevTools v4: Este cambio incluye una actualización a las últimas React DevTools que ofrecen mejoras significativas de rendimiento, una experiencia de navegación mejorada y soporte completo para React Hooks.

• Mejoras de accesibilidad: Hemos realizado mejoras en accesibilidad incluyendo la adición de accessibilityValue, props faltantes en Touchables, eventos de accesibilidad onSlidingComplete accesibilidad, y cambiar el rol predeterminado del componente Switch de "button" a "switch".

Cambios importantes

• Eliminación de PropTypes: Estamos eliminando propTypes de los componentes principales para reducir el impacto en el tamaño de la aplicación del núcleo de React Native y favorecer sistemas de tipos estáticos que se verifican en tiempo de compilación en lugar de en tiempo de ejecución.

• Eliminación de accessibilityStates: Hemos eliminado la propiedad obsoleta accessibilityStates en favor de la nueva prop accessibilityState, que es una forma semánticamente más rica para que los componentes describan información sobre su estado a los servicios de accesibilidad.

• Cambios en TextInput: Eliminamos onTextInput de TextInput ya que es poco común, no cumple con W3C y es difícil de implementar en Fabric. También eliminamos la prop no documentada inputView y selectionState.

Obsoletos

• AccessibilityInfo.fetch ya estaba obsoleto, pero en esta versión añadimos una advertencia.

• Especificar useNativeDriver es ahora obligatorio para soportar cambiar el valor predeterminado en el futuro.

• La ref de un componente Animated es ahora el componente interno y getNode está obsoleto.

Agradecimientos

¡Gracias a los cientos de colaboradores que ayudaron a hacer posible la versión 0.62!

Para ver todas las actualizaciones, consulta el registro de cambios de la versión 0.62.