Apollo client with id default not found.
Describe the bug
I have a nuxt application that sets up and provides the apolloClient (see defineNuxtPlugin below)
Then I have a vue component that comes from an installed dependency.
That component is rendered by the nuxt application and uses the useQuery method from '@vue/apollo-composable'.
However, when that method is called it throws an error
Uncaught Error: Apollo client with id default not found. Use an app.runWithContext() or provideApolloClient() if you are outside of a component setup.
import { provideApolloClient, DefaultApolloClient } from '@vue/apollo-composable'
import { ApolloClient, InMemoryCache, createHttpLink } from '@apollo/client/core'
export default defineNuxtPlugin((nuxtApp) => {
const apolloClient = new ApolloClient({
cache: new InMemoryCache(),
defaultHttpLink: false,
link: createHttpLink({...})
})
provideApolloClient(apolloClient)
nuxtApp.vueApp.provide(DefaultApolloClient, apolloClient)
})
Versions vue: 3.4.30 @vue/apollo-composable: 4.0.2 @apollo/client: 3.10.8
That's weird. I am not sure if defineNuxtPlugin is a root-level effect scope (no experience with nuxt), if it isn't provideApolloClient can't work, but looks like nuxtApp.vueApp.provide should do the trick. Can you create a minimal reproduction in a separate github repo to check it further?
It's difficult create a minimal reproduction as it seems the issue becomes present when there is a version mismatch between the vue-composables dependencies in the parent vs the vue-composables dependencies in the child package 🤔