45 lines
1012 B
TypeScript
45 lines
1012 B
TypeScript
import type {
|
|
DehydratedState,
|
|
VueQueryPluginOptions,
|
|
} from "@tanstack/vue-query";
|
|
import {
|
|
VueQueryPlugin,
|
|
QueryClient,
|
|
hydrate,
|
|
dehydrate,
|
|
} from "@tanstack/vue-query";
|
|
|
|
import { defineNuxtPlugin, useState } from "#imports";
|
|
|
|
export default defineNuxtPlugin((nuxt) => {
|
|
const vueQueryState = useState<DehydratedState | null>("vue-query");
|
|
|
|
const queryClient = new QueryClient({
|
|
defaultOptions: {
|
|
queries: {
|
|
staleTime: 5000,
|
|
experimental_prefetchInRender: true,
|
|
},
|
|
},
|
|
});
|
|
const options: VueQueryPluginOptions = { queryClient };
|
|
|
|
nuxt.vueApp.use(VueQueryPlugin, options);
|
|
|
|
if (import.meta.server) {
|
|
nuxt.hooks.hook("app:rendered", () => {
|
|
vueQueryState.value = dehydrate(queryClient);
|
|
});
|
|
}
|
|
|
|
if (import.meta.client) {
|
|
hydrate(queryClient, vueQueryState.value);
|
|
}
|
|
|
|
return {
|
|
provide: {
|
|
queryClient,
|
|
},
|
|
};
|
|
});
|