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:
npm install
para instalar la dependenciareact-query
requerida.npm start
para verificar que la aplicación pueda ejecutarse localmente.npm run build
para verificar que el proceso de construcción es exitoso.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.