Skip to content

Commit

Permalink
docs: update vite-ssr example
Browse files Browse the repository at this point in the history
  • Loading branch information
DamianOsipiuk committed Sep 10, 2022
1 parent 9092a63 commit 111167c
Showing 1 changed file with 5 additions and 6 deletions.
11 changes: 5 additions & 6 deletions docs/guides/ssr.md
Original file line number Diff line number Diff line change
Expand Up @@ -148,26 +148,25 @@ Sync VueQuery client state with [vite-ssr](https://github.com/frandiox/vite-ssr)
// main.js (entry point)
import App from "./App.vue";
import viteSSR from "vite-ssr/vue";
import { QueryClient, hydrate, dehydrate, VUE_QUERY_CLIENT } from "vue-query";
import { QueryClient, VueQueryPlugin, hydrate, dehydrate } from "vue-query";

export default viteSSR(App, { routes: [] }, ({ app, initialState }) => {
// -- This is Vite SSR main hook, which is called once per request

// Create a fresh VueQuery client
const client = new QueryClient();
const queryClient = new QueryClient();

// Sync initialState with the client state
if (import.meta.env.SSR) {
// Indicate how to access and serialize VueQuery state during SSR
initialState.vueQueryState = { toJSON: () => dehydrate(client) };
initialState.vueQueryState = { toJSON: () => dehydrate(queryClient) };
} else {
// Reuse the existing state in the browser
hydrate(client, initialState.vueQueryState);
hydrate(queryClient, initialState.vueQueryState);
}

// Mount and provide the client to the app components
client.mount();
app.provide(VUE_QUERY_CLIENT, client);
app.use(VueQueryPlugin, { queryClient });
});
```
Expand Down

0 comments on commit 111167c

Please sign in to comment.