How to use the vue-apollo/ssr.prefetchAll function in vue-apollo

// So when those components are rendering, the GraphQL queries use the apollo-client cache for their data.
            // The biggest caveat to this approach is that when pre-fetching, the queries don't have access
            // to their Vue component instance. In other words, SSR pre-fetch queries can't set query variables
            // based on component props, state, etc...
            // Prefetch queries only have access to the context data that are provided via the `prefetchAll`
            // method below. In this scenario we provide current route and state data provided by the server.

            // only these components will be prefetched, so we find JSS components in the route data,
            // as well as static components in the route from the router
            const apolloComponentsToSSR = [
              ...matchedComponents,
              ...resolveComponentsInRoute(state.sitecore),
              // got static components etc that need to prefetch GraphQL queries? Add them here.
            ].filter((component) => component.apollo);

            return ApolloSSR.prefetchAll(graphQLProvider, apolloComponentsToSSR, {
              route: router.currentRoute,
              state,
            });
          })
          .then(() => {

async ({ app, router, route, store, ssr, error }) => {
          const matchedComponents = router.getMatchedComponents();

          try {
            await ApolloSSR.prefetchAll(
              app.$apolloProvider,
              [App, ...matchedComponents],
              {
                route,
                store,
              },
            );
            ssr.bodyAdd = ``;
          } catch (err) {
            error(err);
          }
        },
      );