Dependency Conflict in Nuxt3

[tannd-ds]

My project is written using Nuxt3 and my project dependencies in package.json is shown as following

{
  "name": "nuxt-app",
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "devDependencies": {
    "@nuxt/devtools": "latest",
    "@nuxtjs/color-mode": "^3.3.0",
    "@nuxtjs/supabase": "^0.3.8",
    "@pinia-plugin-persistedstate/nuxt": "^1.1.1",
    "@pinia/nuxt": "^0.4.11",
    "@types/node": "^18",
    "autoprefixer": "^10.4.14",
    "nuxt": "^3.5.2",
    "nuxt-icon": "^0.4.1",
    "postcss": "^8.4.24",
    "prettier": "^3.0.1",
    "prettier-plugin-tailwindcss": "^0.5.2",
    "tailwindcss": "^3.3.2"
  },
  "dependencies": {
    "@headlessui/vue": "^1.7.14",
    "@heroicons/vue": "^2.0.18",
    "@vueuse/core": "^10.2.1",
    "@vueuse/nuxt": "^10.3.0",
    "nuxt-headlessui": "^1.1.4",
    "nuxt-storage": "^1.2.2",
    "pinia": "^2.1.4"
  }
}

I tried install this using the following command

npm install @vueuse/sound

It returned following error (this is a full log file)

'Log files:
C:\Users\admin\AppData\Local\npm-cache\_logs\2023-08-22T08_43_25_691Z-debug-0.log

# npm resolution error report

While resolving: nuxt-app@undefined
Found: vue@3.3.4
node_modules/vue
  peer vue@"^3.2.0" from @headlessui/vue@1.7.14
  node_modules/@headlessui/vue
    @headlessui/vue@"^1.0.0" from nuxt-headlessui@1.1.4
    node_modules/nuxt-headlessui
      nuxt-headlessui@"^1.1.4" from the root project
    @headlessui/vue@"^1.7.14" from the root project
  peer vue@">= 3" from @heroicons/vue@2.0.18
  node_modules/@heroicons/vue
    @heroicons/vue@"^2.0.18" from the root project
  peer vue@">=3" from @iconify/vue@4.1.1
  node_modules/@iconify/vue
    @iconify/vue@"^4.1.1" from nuxt-icon@0.4.1
    node_modules/nuxt-icon
      dev nuxt-icon@"^0.4.1" from the root project
  peer vue@"^3.3.4" from @nuxt/vite-builder@3.6.5
  node_modules/@nuxt/vite-builder
    @nuxt/vite-builder@"3.6.5" from nuxt@3.6.5
    node_modules/nuxt
      peer nuxt@"^3.6.1" from @nuxt/devtools@0.6.7
      node_modules/@nuxt/devtools
        dev @nuxt/devtools@"latest" from the root project
      peer nuxt@"^3.6.1" from @nuxt/devtools-kit@0.6.7
      node_modules/@nuxt/devtools-kit
        @nuxt/devtools-kit@"0.6.7" from @nuxt/devtools@0.6.7
        node_modules/@nuxt/devtools
          dev @nuxt/devtools@"latest" from the root project
      nuxt@"^3.6.5" from @vueuse/nuxt@10.3.0
      node_modules/@vueuse/nuxt
        @vueuse/nuxt@"^10.3.0" from the root project
      dev nuxt@"^3.5.2" from the root project
  peer vue@">=2.7 || >=3" from @unhead/vue@1.1.30
  node_modules/@unhead/vue
    @unhead/vue@"^1.1.30" from nuxt@3.6.5
    node_modules/nuxt
      peer nuxt@"^3.6.1" from @nuxt/devtools@0.6.7
      node_modules/@nuxt/devtools
        dev @nuxt/devtools@"latest" from the root project
      peer nuxt@"^3.6.1" from @nuxt/devtools-kit@0.6.7
      node_modules/@nuxt/devtools-kit
        @nuxt/devtools-kit@"0.6.7" from @nuxt/devtools@0.6.7
        node_modules/@nuxt/devtools
          dev @nuxt/devtools@"latest" from the root project
      nuxt@"^3.6.5" from @vueuse/nuxt@10.3.0
      node_modules/@vueuse/nuxt
        @vueuse/nuxt@"^10.3.0" from the root project
      dev nuxt@"^3.5.2" from the root project
  peer vue@"^3.2.25" from @vitejs/plugin-vue@4.2.3
  node_modules/@vitejs/plugin-vue
    @vitejs/plugin-vue@"^4.2.3" from @nuxt/vite-builder@3.6.5
    node_modules/@nuxt/vite-builder
      @nuxt/vite-builder@"3.6.5" from nuxt@3.6.5
      node_modules/nuxt
        peer nuxt@"^3.6.1" from @nuxt/devtools@0.6.7
        node_modules/@nuxt/devtools
          dev @nuxt/devtools@"latest" from the root project
        peer nuxt@"^3.6.1" from @nuxt/devtools-kit@0.6.7
        node_modules/@nuxt/devtools-kit
          @nuxt/devtools-kit@"0.6.7" from @nuxt/devtools@0.6.7
          node_modules/@nuxt/devtools
            dev @nuxt/devtools@"latest" from the root project
        nuxt@"^3.6.5" from @vueuse/nuxt@10.3.0
        node_modules/@vueuse/nuxt
          @vueuse/nuxt@"^10.3.0" from the root project
        dev nuxt@"^3.5.2" from the root project
  peer vue@"^3.0.0" from @vitejs/plugin-vue-jsx@3.0.1
  node_modules/@vitejs/plugin-vue-jsx
    @vitejs/plugin-vue-jsx@"^3.0.1" from @nuxt/vite-builder@3.6.5
    node_modules/@nuxt/vite-builder
      @nuxt/vite-builder@"3.6.5" from nuxt@3.6.5
      node_modules/nuxt
        peer nuxt@"^3.6.1" from @nuxt/devtools@0.6.7
        node_modules/@nuxt/devtools
          dev @nuxt/devtools@"latest" from the root project
        peer nuxt@"^3.6.1" from @nuxt/devtools-kit@0.6.7
        node_modules/@nuxt/devtools-kit
          @nuxt/devtools-kit@"0.6.7" from @nuxt/devtools@0.6.7
          node_modules/@nuxt/devtools
            dev @nuxt/devtools@"latest" from the root project
        nuxt@"^3.6.5" from @vueuse/nuxt@10.3.0
        node_modules/@vueuse/nuxt
          @vueuse/nuxt@"^10.3.0" from the root project
        dev nuxt@"^3.5.2" from the root project
  peerOptional vue@"^2.7.0 || ^3.2.25" from @vue-macros/common@1.4.0
  node_modules/@vue-macros/common
    @vue-macros/common@"^1.3.1" from unplugin-vue-router@0.6.4
    node_modules/unplugin-vue-router
      unplugin-vue-router@"^0.6.4" from nuxt@3.6.5
      node_modules/nuxt
        peer nuxt@"^3.6.1" from @nuxt/devtools@0.6.7
        node_modules/@nuxt/devtools
          dev @nuxt/devtools@"latest" from the root project
        peer nuxt@"^3.6.1" from @nuxt/devtools-kit@0.6.7
        node_modules/@nuxt/devtools-kit
          @nuxt/devtools-kit@"0.6.7" from @nuxt/devtools@0.6.7
          node_modules/@nuxt/devtools
            dev @nuxt/devtools@"latest" from the root project
        nuxt@"^3.6.5" from @vueuse/nuxt@10.3.0
        node_modules/@vueuse/nuxt
          @vueuse/nuxt@"^10.3.0" from the root project
        dev nuxt@"^3.5.2" from the root project
  peer vue@"3.3.4" from @vue/server-renderer@3.3.4
  node_modules/@vue/server-renderer
    @vue/server-renderer@"3.3.4" from vue@3.3.4
  peer vue@"^3.0.0-0 || ^2.6.0" from vue-demi@0.14.5
  node_modules/@vueuse/core/node_modules/vue-demi
    vue-demi@">=0.14.5" from @vueuse/core@10.3.0
    node_modules/@vueuse/core
      @vueuse/core@"10.3.0" from @vueuse/nuxt@10.3.0
      node_modules/@vueuse/nuxt
        @vueuse/nuxt@"^10.3.0" from the root project
      @vueuse/core@"^10.2.1" from the root project
  peer vue@"^3.0.0-0 || ^2.6.0" from vue-demi@0.14.5
  node_modules/@vueuse/nuxt/node_modules/vue-demi
    vue-demi@">=0.14.5" from @vueuse/nuxt@10.3.0
    node_modules/@vueuse/nuxt
      @vueuse/nuxt@"^10.3.0" from the root project
  peer vue@"^3.0.0-0 || ^2.6.0" from vue-demi@0.14.5
  node_modules/@vueuse/shared/node_modules/vue-demi
    vue-demi@">=0.14.5" from @vueuse/shared@10.3.0
    node_modules/@vueuse/shared
      @vueuse/shared@"10.3.0" from @vueuse/core@10.3.0
      node_modules/@vueuse/core
        @vueuse/core@"10.3.0" from @vueuse/nuxt@10.3.0
        node_modules/@vueuse/nuxt
          @vueuse/nuxt@"^10.3.0" from the root project
        @vueuse/core@"^10.2.1" from the root project
  vue@"^3.3.4" from nuxt@3.6.5
  node_modules/nuxt
    peer nuxt@"^3.6.1" from @nuxt/devtools@0.6.7
    node_modules/@nuxt/devtools
      dev @nuxt/devtools@"latest" from the root project
    peer nuxt@"^3.6.1" from @nuxt/devtools-kit@0.6.7
    node_modules/@nuxt/devtools-kit
      @nuxt/devtools-kit@"0.6.7" from @nuxt/devtools@0.6.7
      node_modules/@nuxt/devtools
        dev @nuxt/devtools@"latest" from the root project
    nuxt@"^3.6.5" from @vueuse/nuxt@10.3.0
    node_modules/@vueuse/nuxt
      @vueuse/nuxt@"^10.3.0" from the root project
    dev nuxt@"^3.5.2" from the root project
  peer vue@"^2.6.14 || ^3.3.0" from pinia@2.1.4
  node_modules/pinia
    pinia@">=2.1.0" from @pinia/nuxt@0.4.11
    node_modules/@pinia/nuxt
      peer @pinia/nuxt@"^0.4.4" from @pinia-plugin-persistedstate/nuxt@1.1.1
      node_modules/@pinia-plugin-persistedstate/nuxt
        dev @pinia-plugin-persistedstate/nuxt@"^1.1.1" from the root project
      dev @pinia/nuxt@"^0.4.11" from the root project
    peer pinia@"^2.0.0" from pinia-plugin-persistedstate@3.1.0
    node_modules/pinia-plugin-persistedstate
      pinia-plugin-persistedstate@">=3.1.0" from @pinia-plugin-persistedstate/nuxt@1.1.1
      node_modules/@pinia-plugin-persistedstate/nuxt
        dev @pinia-plugin-persistedstate/nuxt@"^1.1.1" from the root project
    pinia@"^2.1.4" from the root project
  peer vue@"^3.0.0-0 || ^2.6.0" from vue-demi@0.14.5
  node_modules/pinia/node_modules/vue-demi
    vue-demi@">=0.14.5" from pinia@2.1.4
    node_modules/pinia
      pinia@">=2.1.0" from @pinia/nuxt@0.4.11
      node_modules/@pinia/nuxt
        peer @pinia/nuxt@"^0.4.4" from @pinia-plugin-persistedstate/nuxt@1.1.1
        node_modules/@pinia-plugin-persistedstate/nuxt
          dev @pinia-plugin-persistedstate/nuxt@"^1.1.1" from the root project
        dev @pinia/nuxt@"^0.4.11" from the root project
      peer pinia@"^2.0.0" from pinia-plugin-persistedstate@3.1.0
      node_modules/pinia-plugin-persistedstate
        pinia-plugin-persistedstate@">=3.1.0" from @pinia-plugin-persistedstate/nuxt@1.1.1
        node_modules/@pinia-plugin-persistedstate/nuxt
          dev @pinia-plugin-persistedstate/nuxt@"^1.1.1" from the root project
      pinia@"^2.1.4" from the root project
  peer vue@"^3.2.0" from vue-router@4.2.4
  node_modules/vue-router
    vue-router@"^4.2.4" from nuxt@3.6.5
    node_modules/nuxt
      peer nuxt@"^3.6.1" from @nuxt/devtools@0.6.7
      node_modules/@nuxt/devtools
        dev @nuxt/devtools@"latest" from the root project
      peer nuxt@"^3.6.1" from @nuxt/devtools-kit@0.6.7
      node_modules/@nuxt/devtools-kit
        @nuxt/devtools-kit@"0.6.7" from @nuxt/devtools@0.6.7
        node_modules/@nuxt/devtools
          dev @nuxt/devtools@"latest" from the root project
      nuxt@"^3.6.5" from @vueuse/nuxt@10.3.0
      node_modules/@vueuse/nuxt
        @vueuse/nuxt@"^10.3.0" from the root project
      dev nuxt@"^3.5.2" from the root project
    peerOptional vue-router@"^4.1.0" from unplugin-vue-router@0.6.4
    node_modules/unplugin-vue-router
      unplugin-vue-router@"^0.6.4" from nuxt@3.6.5
      node_modules/nuxt
        peer nuxt@"^3.6.1" from @nuxt/devtools@0.6.7
        node_modules/@nuxt/devtools
          dev @nuxt/devtools@"latest" from the root project
        peer nuxt@"^3.6.1" from @nuxt/devtools-kit@0.6.7
        node_modules/@nuxt/devtools-kit
          @nuxt/devtools-kit@"0.6.7" from @nuxt/devtools@0.6.7
          node_modules/@nuxt/devtools
            dev @nuxt/devtools@"latest" from the root project
        nuxt@"^3.6.5" from @vueuse/nuxt@10.3.0
        node_modules/@vueuse/nuxt
          @vueuse/nuxt@"^10.3.0" from the root project
        dev nuxt@"^3.5.2" from the root project

Could not resolve dependency:
@vueuse/sound@"*" from the root project

Conflicting peer dependency: vue@2.6.14
node_modules/vue
  peer vue@">= 2.5 < 2.7" from @vue/composition-api@1.7.2
  node_modules/@vue/composition-api
    peerOptional @vue/composition-api@"^1.0.0-rc.1" from @vueuse/sound@2.0.1
    node_modules/@vueuse/sound
      @vueuse/sound@"*" from the root project

Fix the upstream dependency conflict, or retry
this command with --force or --legacy-peer-deps
to accept an incorrect (and potentially broken) dependency resolution.

Have you previously encountered this issue, or would you happen to possess insights on its resolution? Thank you in advance!

[davidstackio]

Adding this to my package.json stopped this error:

"overrides": {
  "vue": "latest"
}