Closed MoeinMirkiani closed 7 months ago
For what it's worth, I'm fighting with the same situation. I'm totally new to nuxt, so some user error is likely on my behalf.
Same problem here. useQuery composable does not work. It says @vue/apollo-composable is missing. Documentation does not say we need to install @vue/apollo-composable and even trying it had a dependency conflict and needs a --force param. comparing this module to vue-apollo, there are many features those are missing here. I've tried to use vue-apollo without this module but I haven't been able to properly add it to nuxt: 3.7.
Any news?
I remember I already encountered this problem and I'm surprised it's still a thing. I thought it was going be a quickly solved as it's an essential composable. But this issue has been present for several months now.
Also experiencing this!
For what it's worth, I think I found a work-around. When you install @vue/apollo-composable
to fix the dependency issue, use the specific version defined in this project's dependencies, which at the time of writing is @vue/apollo-composable@4.0.0-beta.4
.
npm i -D @vue/apollo-composable@4.0.0-beta.4
pnpm i -D @vue/apollo-composable@4.0.0-beta.4
yarn add -D @vue/apollo-composable@4.0.0-beta.4
With this version, things appear to be working again!
hitting the same issue it's unsable at the moment ...
For what it's worth, I think I found a work-around. When you install
@vue/apollo-composable
to fix the dependency issue, use the specific version defined in this project's dependencies, which at the time of writing is@vue/apollo-composable@4.0.0-beta.4
.npm i -D @vue/apollo-composable@4.0.0-beta.4 pnpm i -D @vue/apollo-composable@4.0.0-beta.4 yarn add -D @vue/apollo-composable@4.0.0-beta.4
With this version, things appear to be working again!
This fixed the issue for me
More possibly useful info, if you need the latest version of @vue/apollo-composable
like I did to gain access to awaitable load
from useLazyQuery
for suspense support, you can work around the provide issue by creating this plugin in your plugins
directory:
// plugins/apollo.client.ts
import { provideApolloClients } from '@vue/apollo-composable';
export default defineNuxtPlugin((nuxtApp) => {
// @ts-expect-error nuxt-apollo module needs updated types
provideApolloClients(nuxtApp.$apollo.clients);
});
This issue is fixed and a workaround is no longer required in my project on the latest version!
@Diizzayy Looks like this issue is appearing again. 😢
I did a little more investigating and I think I know why. The DefaultApolloClient
and ApolloClients
keys meant to be used for provide/inject exported by @vue/apollo-composable
are Symbols
, and as such when the @vue/apollo-composable
version being used by this module (4.0.0-beta.11
at time of writing) and the version used in a project (4.0.0-beta.12
is the latest release), the keys being used do not match anymore because technically the symbols being exported/imported are different values when coming from different versions.
I feel a possible long-term solution to this problem would be to make @vue/apollo-composable
a peerDependency
in this project so that the internal version used matches the version used in the project. I believe you can also mark peer deps as optional so that people can still install the module without explicitly installing the peer dep for simplicity sake.
This also means there is yet another workaround for people like me... if you set the overrides
field in your package.json to be the latest version it should start working again (as long as this module is still compatible of course!)
"overrides": {
"@vue/apollo-composable": "^4.0.0-beta.12"
}
Thanks a lot @danielwaltz it has resolved issue. Now I am able to use useMutation with clientId.
Environment
Describe the bug
I'm trying to perform a simple API call with
useQuery
composable. First of all, to use this composable I need to install@vue/apollo-composable
with--force
in order to be able to useuseQuery
. There is no mention of this in the documentation. The main problem is as follows. These are my configs:nuxt.config.ts:
apollo/clients/default.ts:
apollo/clients/rick.ts:
And this is the setup script of my
test.vue
page:Instead of getting the standard response object in browser console, I'm getting this error:
Uncaught (in promise) Error: No apolloClients injection found, tried to resolve 'rick' clientId
Expected behaviour
I'm not getting the expected response from
useQuery
request as described in "Describe the bug" section. I provided the used version of all packages inside the "Environment" section.Reproduction
No response
Additional context
No response
Logs
No response