Installing
Hi,
I've been using vue-query for a while and really like it. I decided to rebuild my project from the ground up now that I've found all the additional pieces I think I need. I apologize if this a very silly question, but I'm stuck just installing right now. If I start a new project with this command:
npx nuxi init -t ui <project-name>
it works fine. However, if I next try to install vue-query:
npm i @tanstack/vue-query
I get this big npm error:
npm error While resolving: nuxt-app@undefined
npm error Found: vue@3.4.30
npm error node_modules/vue
npm error peer vue@"^3.2.0" from @headlessui/vue@1.7.22
npm error node_modules/@headlessui/vue
npm error @headlessui/vue@"^1.7.22" from @nuxt/ui@2.17.0
npm error node_modules/@nuxt/ui
npm error dev @nuxt/ui@"^2.17.0" from the root project
npm error peer vue@">=3" from @iconify/vue@4.1.2
npm error node_modules/@iconify/vue
npm error @iconify/vue@"^4.1.1" from nuxt-icon@0.6.10
npm error node_modules/nuxt-icon
npm error nuxt-icon@"^0.6.10" from @nuxt/ui@2.17.0
npm error node_modules/@nuxt/ui
npm error dev @nuxt/ui@"^2.17.0" from the root project
npm error 13 more (@nuxt/vite-builder, @tanstack/vue-virtual, ...)
npm error Could not resolve dependency:
npm error @tanstack/vue-query@"" from the root project
npm error Conflicting peer dependency: vue@2.6.14
npm error node_modules/vue
npm error peer vue@">= 2.5 < 2.7" from @vue/composition-api@1.7.2
npm error node_modules/@vue/composition-api
npm error peerOptional @vue/composition-api@"^1.1.2" from @tanstack/vue-query@5.45.0
npm error node_modules/@tanstack/vue-query
npm error @tanstack/vue-query@"" from the root project
Should I really just use --legacy-peer-deps? If I do and go a bit further, I start getting other weird errors.
If using the legacy flag is OK, please let me know. Otherwise I'm not sure how to proceed.
Thanks for any help folks can provide!
Sam
3 Replies
extended-salmon•15mo ago
NPM has broken peer dependency resolution.
@vue/composition-api is marked as optional yet it still triggers an error.
Use legacy or force flag. But that might hide other package issues.
Better yet switch package manager to pnpmmetropolitan-bronze•15mo ago
A lot of Vue packages won't work directly with Nuxt, so you should always look for the associated Nuxt module if available.
Try this one: https://nuxt.com/modules/vue-query
like-goldOP•15mo ago
Thanks very much to both of you for your advice. I tried vue-query package you suggested stradox but I get the same error. Changing package managers seems intimidating but I'll give it a try!
Just FYI - went with the new package manager (pnpm) and everything is working again! Thanks for the good advice!