Unable to install vue-query for nuxt 3

[dextersiah]

Describe the bug

Hi folks, I am trying to experiment vue-query with Nuxt3 however when I'm trying to install the package via npm. I got an error regarding conflicting peer dependency.

However it seems to be installing right in the stackblitz environment.

Your minimal, reproducible example

https://stackblitz.com/edit/nuxt-starter-vgim69?file=package.json

Steps to reproduce

1. Create a new Nuxt3 project with npx nuxi@latest init my-app
2. Install vue-query npm i @tanstack/vue-query
3. Error installing package

Expected behavior

There shouldn't be a dependency peer issue as I'm installing the latest Nuxt3 Version

How often does this bug happen?

Every time

Screenshots or Videos

Platform

• Operation System: Windows 11
• Node Version :v16.14.0
• NPM Version: 8.3.1
• Nuxt: ^3.2.3

Tanstack Query adapter

None

TanStack Query version

^4.26.1

TypeScript version

No response

Additional context

No response

[ctholho]

This is a problem on your end. E.g. try to clean the npm cache (e.g. npm cache clean --force) and make sure you're not accidentally in a directory with a package.json that has vue 2.6 as dependency.

[dextersiah]

Indeed it seems like a cache issue. Fixed with the cache clean command. thanks @ctholho. Mark as answered

[kendallroth]

I am running into the same issue, with a fresh install of Nuxt 3. Cleaning the cache unfortunately did not resolve the issue, and I have verified that Vue 2.6 is not required anywhere.

• [email protected]
• [email protected]

❯ npm install @tanstack/vue-query
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: nuxt-app@undefined
npm ERR! Found: [email protected]
npm ERR! node_modules/vue
npm ERR!   peer vue@"^3.2.47" from @nuxt/[email protected]
npm ERR!   node_modules/@nuxt/vite-builder
npm ERR!     @nuxt/vite-builder@"3.3.2" from [email protected]
npm ERR!     node_modules/nuxt
npm ERR!       dev nuxt@"^3.3.2" from the root project
npm ERR!   peer vue@">=2.7 || >=3" from @unhead/[email protected]
npm ERR!   node_modules/@unhead/vue
npm ERR!     @unhead/vue@"^1.1.23" from [email protected]
npm ERR!     node_modules/nuxt
npm ERR!       dev nuxt@"^3.3.2" from the root project
npm ERR!   8 more (@vitejs/plugin-vue, @vitejs/plugin-vue-jsx, ...)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! @tanstack/vue-query@"*" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: [email protected]
npm ERR! node_modules/vue
npm ERR!   peer vue@">= 2.5 < 2.7" from @vue/[email protected]
npm ERR!   node_modules/@vue/composition-api
npm ERR!     peerOptional @vue/composition-api@"^1.1.2" from @tanstack/[email protected]
npm ERR!     node_modules/@tanstack/vue-query
npm ERR!       @tanstack/vue-query@"*" from the root project

[pastinepolenta]

Recent NPM version install peer dependencies by default. @tanstack/vue-query has a peer dependency @vue/composition-api@"^1.1.2" which in turn has a peer dependency vue@">= 2.5 < 2.7" which does not match with the goal of using Vue 3 instead of 2.

Is the peer dependencies config of those packages correct ? Or am I missing something?
EDIT: I had an issue on my registry ignoring the optional part of @vue/composition-api and so creating a conflict

[ctholho]

Edit: ninja'd by your edit. 👍
@pastinepolenta @vue/composition-api is marked as optional

query/packages/vue-query/package.json

Lines 56 to 58 in 5335294

	"peerDependenciesMeta": {
	"@vue/composition-api": {
	"optional": true

Optional peer dependencies shouldn't be installed: See npm/rfcs#221

The repro stackblitz of OP doesn't have the problem you're describing.