nuxt-modules
Failed to resolve import "@vue/apollo-composable
Environment
- Operating System:
Darwin - Node Version:
v20.4.0 - Nuxt Version:
3.7.4 - CLI Version:
3.9.0 - Nitro Version:
2.6.3 - Package Manager:
[email protected] - Builder:
- - User Config:
runtimeConfig,devtools,nitro,build,css,modules,components,googleFonts,pwa,i18n,apollo,image - Runtime Modules:
@nuxtjs/[email protected],@kevinmarrec/[email protected],@nuxtjs/[email protected],@nuxtjs/[email protected],@nuxt/[email protected],@nuxtjs/[email protected],@pinia/[email protected] - Build Modules:
-
Describe the bug
I literally have no clue why this jumped in my screen at once. It was working before. I am calling a mutation as follows:
const { mutate: submitForMutation, loading, error } = useMutation<ResponseLogin>(loginMutation)
async function submitForm() {
const isFormCorrect = await v$.value.$validate()
if (isFormCorrect) {
await submitForMutation({
input: {
identifier: loginData.value.email,
password: loginData.value.password,
provider: 'local',
},
})
.then((response) => {
onLogin(response?.data?.login.jwt)
useAuthStore().setUser(response?.data?.login.user)
useAuthStore().setBearer(response?.data?.login.jwt)
})
}
}
In my <script lang="ts" setup>.
It gives me the following error in my console:
Internal server error: Failed to resolve import "@vue/apollo-composable" from "components/forms/FormLogin.vue". Does the file exist? 8:51:08 PM
Plugin: vite:import-analysis
File: /Users/boriskamp/Documents/bk-development/todays-portal-nuxt/components/forms/FormLogin.vue:7:30
5 | import { useI18nValidators } from '/Users/boriskamp/Documents/bk-development/todays-portal-nuxt/composables/i18n-validators.ts';
6 | import { ref, computed } from 'vue';
7 | import { useMutation } from '@vue/apollo-composable';
| ^
8 | /* Injection by vite-plugin-vue-inspector Start */
9 | import { createVNode as __createVNode,createElementVNode as __createElementVNode,createElementBlock as __createElementBlock } from 'vue'
at formatError (file:///Users/boriskamp/Documents/bk-development/todays-portal-nuxt/node_modules/vite/dist/node/chunks/dep-bb8a8339.js:44062:46)
at TransformContext.error (file:///Users/boriskamp/Documents/bk-development/todays-portal-nuxt/node_modules/vite/dist/node/chunks/dep-bb8a8339.js:44058:19)
at normalizeUrl (file:///Users/boriskamp/Documents/bk-development/todays-portal-nuxt/node_modules/vite/dist/node/chunks/dep-bb8a8339.js:41844:33)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async file:///Users/boriskamp/Documents/bk-development/todays-portal-nuxt/node_modules/vite/dist/node/chunks/dep-bb8a8339.js:41998:47
at async Promise.all (index 6)
at async TransformContext.transform (file:///Users/boriskamp/Documents/bk-development/todays-portal-nuxt/node_modules/vite/dist/node/chunks/dep-bb8a8339.js:41914:13)
at async file:///Users/boriskamp/Documents/bk-development/todays-portal-nuxt/node_modules/vite-plugin-inspect/dist/index.mjs:922:19
at async Object.transform (file:///Users/boriskamp/Documents/bk-development/todays-portal-nuxt/node_modules/vite/dist/node/chunks/dep-bb8a8339.js:44352:30)
at async loadAndTransform (file:///Users/boriskamp/Documents/bk-development/todays-portal-nuxt/node_modules/vite/dist/node/chunks/dep-bb8a8339.js:55026:29) (x3)
Expected behaviour
To just work like it did before....
Reproduction
No response
Additional context
No response
Logs
No response
Same issue here, as soon as I make reference to the useMutation, useSubscription, or useQuery composables.
useAsyncQuery and useLazyAsyncQuery composables do not do this.
Since it seems to be an issue with the auto import, any reference is enough to make it bail like this for me.
<script setup lang="ts">
useMutation;
</script>
<template></template>
ERROR Internal server error: Failed to resolve import "@vue/apollo-composable" from "pages/centres/[id]/edit.vue". Does the file exist?
Plugin: vite:import-analysis
10 | import { gql } from 'graphql-tag';
11 | import { useAsyncQuery } from '/Volumes/(snip)/nuxt-test/node_modules/@nuxtjs/apollo/dist/runtime/composables';
12 | import { useMutation } from '@vue/apollo-composable';
| ^
13 | /* Injection by vite-plugin-vue-inspector Start */
14 | import { createVNode as __createVNode,createElementVNode as __createElementVNode,createElementBlock as __createElementBlock } from 'vue'
12 │ "devDependencies": {
13 │ "@nuxt/devtools": "^1.0.0-beta.2",
14 │ "@nuxtjs/apollo": "^5.0.0-alpha.7",
15 │ "nuxt": "^3.7.4",
16 │ "vue": "^3.3.4",
17 │ "vue-router": "^4.2.5"
18 │ },
I could get past this by installing "@vue/apollo-composable" manually, but hitting other issues also mentioned in #550.
I got rid of this package and moved to https://github.com/Diizzayy/nuxt-graphql-client
And I must say it was very easy to setup and use, wish I found this earlier.
Hopefully; the later suggestion in https://github.com/nuxt-modules/apollo/issues/550#issuecomment-1775884358 has been working for me so far @PierreCavalet
@BorisKamp: I tried the same and then i was realizing that the nuxt-graphql-client(https://github.com/jasonkuhrt/graphql-request#why-was-the-file-upload-feature-taken-away-will-it-return) removed the support of file uploads :( And now i am stucked :D How did u solve this? Or do u have no need of file uploads?
