Pinia doesn't show up in devtools (Nuxt 3 app)

[wandolch]

Vue devtools version

6.5.1

Link to minimal reproduction

https://github.com/wandolch/nuxt3-playground

Steps to reproduce & screenshots

Nuxt 3 application that uses pinia 2.1.7 and @pinia/nuxt 0.5.1

Create any Pinia store and use it in a component, hydration enabled.

Vue devtools won't recognise that Pinia exists on client side:

There was a similar ticket in a SPA vue, the reason was that people should define Pinia after mounting the app. In Nuxt it's not the case because Pinia is defned inside @pinia/nuxt and I don't have control over it.

What is expected?

Pinia should appear in vue devtools.

What is actually happening?

Pinia doesn't appear in vue devtools, it's impossible to debug it.

System Info

System:
    OS: macOS 13.6.3
    CPU: (12) arm64 Apple M2 Max
    Memory: 3.81 GB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.15.0 - ~/.nvm/versions/node/v18.15.0/bin/node
    npm: 9.5.0 - ~/.nvm/versions/node/v18.15.0/bin/npm
    pnpm: 8.6.0 - ~/.nvm/versions/node/v18.15.0/bin/pnpm
  Browsers:
    Chrome: 120.0.6099.234
    Safari: 16.6
  npmPackages:
    vue: ^3.4.10 => 3.4.14

Any additional comments?

No response

[azmatzuberi]

I was having a similar issue and I just put the module at the very top and it worked. Although, I see you only have one module.

[amisora]

Having similar issue. Closing dev tools and refreshing the page seems to work occasionally. Looking forward to a reliable solution.

[rileyphoenixbytes]

Having the same problem, a solution would be very much appreciated.

[codeplayer71]

I have the same problem, has anything been done here yet?

[outlabsio]

Same issue here. The other dev on my team with the same environment can see it but I cant. I have another project that works fine.