Actualización a v2.3

Si está actualizando un proyecto de PWA Kit que se creó antes de la disponibilidad de v2, siga primero las instrucciones de la guía Actualización a v2.

Para aprovechar las características de participación disponibles en v2.3, específicamente la integración react-query, debe realizar algunos cambios en _app-config/index.js, _app/index.js y package.json en su proyecto de PWA Kit.

Abra _app-config/index.js y realice los siguientes cambios.

Importe los componentes de orden superior necesarios para habilitar react-query y conservar el soporte de getProps.

Agregue el objeto options con la configuración recomendada de React Query.

Actualice la definición del componente AppConfig exportado.

Abra _app/index.js y realice los siguientes cambios.

Declare una variable llamada DEFAULT_LOCALE para almacenar la configuración local predeterminada para mostrar mensajes en su aplicación. Para un proyecto recién generado, los mensajes predeterminados están escritos en inglés para la configuración local de Estados Unidos. Si no ha reescrito los mensajes predeterminados, entonces en-US es el valor correcto para DEFAULT_LOCALE. De lo contrario, establezca DEFAULT_LOCALE en un valor diferente, como fr-fr o ja-jp.

Asigne DEFAULT_LOCALE como valor predeterminado para la propiedad targetLocale.

Reemplace defaultLocale con el nuevo valor estático.

Si está habilitado, las funciones useQuery y getProps se ejecutan en paralelo. Un efecto secundario de la ejecución en paralelo es que la renderización condicional de un componente según el valor de retorno de getProps puede provocar que algunos enlaces useQuery no se ejecuten en el servidor. En aras de la simplicidad, le recomendamos que elija getProps o useQuery para la obtención de datos.

Agregue react-query a su devDependencies.

Para probar si sus cambios se hicieron con éxito, ejecute los siguientes comandos:

  1. npm install para instalar la dependencia react-query requerida.
  2. npm start para verificar que la aplicación pueda ejecutarse localmente.
  3. npm run build para verificar que el proceso de construcción es exitoso.
  4. npm run push (e implementar a través de Runtime Admin) para verificar que la implementación de un paquete es exitosa.

Para saber más sobre React Query y cómo usarlo, vea la documentación de React Query.