How do you load Apollo with Composition API into Vue 3?

Question

Their docs state:

import { provide } from '@vue/composition-api'
import { DefaultApolloClient } from '@vue/apollo-composable'

const app = new Vue({
  setup () {
    provide(DefaultApolloClient, apolloClient)
  },

  render: h => h(App),
})

which doesn't work. I could find no correct docs online but stumbled upon the answer in a youtube tut. I'm just placing this here in case others may be searching.

Answer 1

Correct syntax with Vue 3:

import { createApp, h, provide } from 'vue';
import App from './App.vue';
import {
  ApolloClient,
  createHttpLink,
  InMemoryCache
} from '@apollo/client/core';
import { DefaultApolloClient } from '@vue/apollo-composable';

const link = createHttpLink({ uri: 'http://localhost:3000/graphql' });
const cache = new InMemoryCache();
const apolloClient = new ApolloClient({ link, cache });

createApp({
  setup() {
    provide(DefaultApolloClient, apolloClient);
  },

  render() {
    return h(App);
  }
}).mount('#app');