Pinia nuxt version 0.6.0+ causes error when used with pnpm monorepo

[kalvenschraut]

Reproduction

https://stackblitz.com/~/github.com/kalvenschraut/pinia-nuxt-pnpm-monorepo-issue

Steps to reproduce the bug

To see issue do

pnpm install
pnpm --filter website1 run dev

can then downgrade @pinia/nuxt to 0.5.5 and run same commands to see it working. Can also upgrade to 0.6.1 to verify still not working

pnpm update @pinia/nuxt@0.5.5 -r
pnpm --filter website1 run dev

Expected behavior

Page to load and show the users name from the user store

Actual behavior

Additional information

In prod builds on my personal site where I first initial saw this was seeing vueDemi.effectScope is not a function error. Downgrading back to 0.5.5 for now until direction can be given

[posva]

I did some research, and the problem persists even with upgraded Nuxt and pnpm. The cause of the problem is the removal of the alias for pinia in 65031ee
I needed that change to work in other scenarios so I will investigate this further. In the meantime, here is a workaround: add an alias to your nuxt.config so pinia is resolved correctly:

import { fileURLToPath } from 'node:url'
import path from 'node:path'

const rootDir = fileURLToPath(new URL('../..', import.meta.url))

export default defineNuxtConfig({
  modules: [ '@pinia/nuxt'],
  alias: {
   pinia: path.resolve(rootDir, 'node_modules/pinia/dist/pinia.mjs')
  }
});

Or exclude pinia from vite optimization:

export default defineNuxtConfig({
  modules: [ '@pinia/nuxt'],
  vite: {
    optimizeDeps: {
      exclude: ['pinia']
    }
  },
});

@danielroe I would like some help with this matter: in my tests, I have two copies of pinia in non monorepo nuxt applications. I still don't understand why this part of the Pinia module is so flaky, and I suppose it's more of an issue of Vite than Nuxt. But I imagine you have seen this issue often enough to guide me in the right direction (and add a note comment so my future self does not forget 😅)

[posva]

Using the shamefully-hoist=false also works

[posva]

I'm still not 100% sure of the fix being the right solution so I will keep this open until then

[jaap3]

I've updated @nuxt/pinia to 0.7.0 last week and started running into this issue. Downgrading to 0.6.1 makes everything work again.

Additional data points:

• I'm also on a monorepo, but using plain npm
• nuxt: ~3.14.159
• pinia: ~2.2.6
• Using nuxt layers, pinia and @nuxt/pinia are installed in the "bottom" layer

EDIT: So 0.6.1 works in development (at least for me), but after a deploy to staging "everything" was broken. Only after downgrading to 0.5.5 did a deployed build work again.

[ibrahimzdmr]

Hello, today I've updated from v0.5.5 to v0.7.0 and couldn't run the project.

This is the error I'm receiving "[nuxt] [request error] [unhandled] [500] Cannot find module '/.output/server/node_modules/pinia/dist/pinia.mjs' imported from /.output/server/chunks/build/server.mjs"

and when I check the file in node module there is only pinia.prod.cjs file.

nuxt: 3.13.2

also I use pnpm

Thank you

[posva]

I think that to fix this we might release a new version that removes the compatibility with Vue 2.6 but keeps Vue 2.7. This will allow removing some peer dependencies that nom isn't able to support (like other package managers do)

[posva]

This was partially fixed en #2846 but requires unjs/nypm#165 to be merged and released so adding the Nuxt module also adds pinia as a dependency to your Nuxt project. In the meantime, or if you already have the @pinia/nuxt module installed, install Pinia alongside the Nuxt module. I will update docs.

[pi0]

https://github.com/unjs/nypm/releases/tag/v0.4.1

[danielroe]

this should now be resolved in latest nuxi! 🎉

[slavanossar]

Can this issue be reopened? It still persists after upgrading to @pinia/nuxt@0.8.0 and regenerating a fresh lockfile, I'm not entirely sure it's the same issue as above.

I'm also using a pnpm monorepo, and I already had pinia as a dependency. The only way to resolve was downgrading to @pinia/nuxt@0.5.5.

Thanks!

[posva]

If you have a boiled down without Apollo or other libraries, I can take a look

[slavanossar]

I'll try to put together a repro for you over the weekend, much appreciated!

[martin-djukanovic]

Can this issue be reopened? It still persists after upgrading to @pinia/nuxt@0.8.0 and regenerating a fresh lockfile, I'm not entirely sure it's the same issue as above.

I'm also using a pnpm monorepo, and I already had pinia as a dependency. The only way to resolve was downgrading to @pinia/nuxt@0.5.5.

Thanks!

Maybe try the following? In node_modules/pinia/dist/pinia.mjs change the definition of shouldHydrate( on line ~1211 by replacing obj.hasOwnProperty(skipHydrateSymbol) with !Object.prototype.hasOwnProperty.call(obj, skipHydrateSymbol). The payload-plugin is the reason why it works on 0.5.5 but not 0.6.0.

I tried to add console.log() to shouldHydrate( to verify that the apollo response is the object that causes the issue, but that caused the server to hang for some reason. 😕