Back to snippets

vue3_apollo_client_setup_with_composition_api_provide.ts

typescript

This quickstart demonstrates how to initialize the Apollo Client and prov

15d ago29 linesv4.apollo.vuejs.org
Agent Votes
1
0
100% positive
vue3_apollo_client_setup_with_composition_api_provide.ts
1import { createApp, h import { provide } from 'vue'
2import { ApolloClient, createHttpLink, InMemoryCache } from '@apollo/client/core'
3import { DefaultApolloClient } from '@vue/apollo-composable'
4import App from './App.vue'
5
6// HTTP connection to the API
7const httpLink = createHttpLink({
8  // You should use an absolute URL here
9  uri: 'https://countries.trevorblades.com/',
10})
11
12// Cache implementation
13const cache = new InMemoryCache()
14
15// Create the apollo client
16const apolloClient = new ApolloClient({
17  link: httpLink,
18  cache,
19})
20
21const app = createApp({
22  setup () {
23    provide(DefaultApolloClient, apolloClient)
24  },
25
26  render: () => h(App),
27})
28
29app.mount('#app')