nuxt: Pinia not working

After running npm install pinia @pinia/nuxt --legacy-peer-deps I removed pinia with npm uninstall pinia and for some reason it is working great like magic 🧙‍♂️

Here’s what worked for me:

1. Install only @pinia/nuxt with npm or yarn
2. Add an alias in your nuxt.config.ts file:

export default defineNuxtConfig({
    alias: {
        pinia: '/node_modules/@pinia/nuxt/node_modules/pinia/dist/pinia.mjs',
    },
    // your config
})

I can confirm fikurmiax’s stackoverflow link works. Installing pina itself (not just ‘@pinia/nuxt’ plus --legacy-peer-deps. However this is not a good fix. Just want to add my voice here that this is broken for me aswell as of 3 days ago.

Using nuxt rc.9 or rc.10 (doesnt work on both) and @pinia/nuxt with

modules: [ ‘@pinia/nuxt’ ]

in nuxt.config.ts

I follow this answer and run perfectly here’s the link

This helped in my case

export default defineNuxtConfig({
    modules: [
        ['@pinia/nuxt', { autoImports: ['defineStore'] }], // v 0.4.6
    ],
    alias: {
        pinia: process.env.NODE_ENV === 'production' ? '/node_modules/pinia/dist/pinia.mjs' : '/node_modules/@pinia/nuxt/node_modules/pinia/dist/pinia.mjs',
    },
});

Had the same issue with RC13. Solved it with this:

rm -rf node_modules && rm package-lock.json && npm install

No alias, no transpile, no npm i pinia , no --legacy-peer-deps. Just @pinia/nuxt in package.json and modules: ['@pinia/nuxt'] in nuxt.config.js.

Did not help. Still get cannot find module pinia/dist/pinia.mjs in Nuxt 3…0.0 . Btw, I’ve been using Nuxt3 since RC 2 and I have to say that Pinia is the one module that has always given me problems.

Only thing that works for me with latest Nuxt3 is to add the alias like was suggested earlier above:

    alias: {
      pinia: '/node_modules/@pinia/nuxt/node_modules/pinia/dist/pinia.mjs'
    },

I don’t like this method because it’s yet another custom config I have to remember for future projects (until this has been fixed).

Had the exact same issue ERROR Cannot start nuxt: Cannot find module 'pinia/dist/pinia.mjs' on a newly created nuxt 3 app with just vuetify’s library installed.

Trying to install pinia didn’t work so had to force it with: npm i --force pinia

That solved my problem.

Would you try clearing your node_modules/.vite and node_modules/.cache folders?

It was something related to the cache because it is working now.

Updating @pinia/nuxt does not clean this cache as npx nuxi-edge@latest upgrade --force does, and I missed the information.

Had the same issue with RC13. Solved it with this:

rm -rf node_modules && rm package-lock.json && npm install

No alias, no transpile, no npm i pinia , no --legacy-peer-deps.

Just npm i pinia, add @pinia/nuxt in package.json and modules: ['@pinia/nuxt'] in nuxt.config.js.

(edited to remove wrong suggestion)

After running npm install pinia @pinia/nuxt --legacy-peer-deps I removed pinia with npm uninstall pinia and for some reason it is working great like magic 🧙‍♂️

Tried lots of other solutions, alias worked but then gave 500 errors in build preview when refreshing the page. Did this though and works like a charm

Same for me in RC10. The solution of @BayBreezy works for me. Even if I remove pinia after installing it. Strange.

Also a common mistake could be that you installed pinia instead of @pinia/nuxt.

No I have installed pinia/nuxt and not pinia because you can’t install pinia on nuxt 3 it gives error from npm

npx nuxi-edge@latest cleanup should also do the trick to cleanup caches.

After running npm install pinia @pinia/nuxt --legacy-peer-deps I removed pinia with npm uninstall pinia and for some reason it is working great like magic 🧙‍♂️

Thank you @BenjaminOddou this solved the issue. It’s magic

After running npm install pinia @pinia/nuxt --legacy-peer-deps I removed pinia with npm uninstall pinia and for some reason it is working great like magic 🧙‍♂️

I’ve also experienced the same issue when installing pinia on nuxt 3 (rc.10) -> Cannot start nuxt: Cannot find module ‘pinia/dist/pinia.mjs’. I tried all the solutions above and this only works for me. Thanks!

Was having the same issue. What worked for me was installing pinia by force lol

npm i pinia --force

I am also on rc-9. I have this config since rc-4 or 5 and didn’t experience any issue

I did like you told but same error is coming.

Error:

Package.json

If you are facing an error, please raise a new issue with a reproduction. You can start from https://stackblitz.com/github/nuxt/starter/tree/v3-stackblitz.

I am not able to reporduce in the stackblitz, but it’s happening to me

Please add this into your nuxt.config.js/ts

alias: { pinia: "/node_modules/@pinia/nuxt/node_modules/pinia/dist/pinia.mjs", },

Was having the same issue. What worked for me was installing pinia by force lol

npm i pinia --force

It works for me 😃

Here’s what worked for me:

1. Install only @pinia/nuxt with npm or yarn
2. Add an alias in your nuxt.config.ts file:

export default defineNuxtConfig({
    alias: {
        pinia: '/node_modules/@pinia/nuxt/node_modules/pinia/dist/pinia.mjs',
    },
    // your config
})

Thanks. Wasn’t able to start Nuxt 3 rc 11 after installing, but this made it work.

Still the same problem for me, I am not able to fix the problem with above solutions.

Hey there, I’d suggest we can close this, not being a nuxt issue but an issue on how to properly configure pinia and or upgrade nuxt to the latest versions. Or this there anything in here that nuxt can fix I may have missed?

Just sharing my experience, from what I have tried. There are 2 ways to use pinia with Nuxt.

1. Using ‘@pinia/nuxt’
2. Using pinia (this is for vue 3 not for nuxt)

I tried the first method and my app crash big time no matter what I try to do.

But with the 2nd method it is much more easier without any problem.

I just run npm install pinia --force

Then I declare using Nuxt plugin with this setup

import { createPinia } from "pinia";

export default defineNuxtPlugin((nuxtApp) => {
	const pinia = createPinia();
	nuxtApp.vueApp.use(pinia);
});

Then I just use pinia in my composables.

Hope this helps

Update latest

It turns out that we need to install both package with the first and second method that I mentioned here.

I updated my comment. Also at some point had do npm i pinia. Don’t remember why, but needed to be done.

For those using autoImports option for @pinia/nuxt, take a look at this PR from the last rc14 version. This option is no longer supported.

Removing package-lock file causes this error for me…removing package-lock then installing using npm install casues pinia add as dependency of @pinia/nuxt which causes problem… Simply move out pinia from dependency tree of @pinia/nuxt to root dependency tree

@BenjaminOddou - sadly same issue. Runs fine in dev without autoimport, it builds fine, but when the build is run the store isn’t created / is “undefined”.

try to uninstalling pinia@2.0.22 only have @pinia/nuxt@0.4.2 @sebj54

Go to the root folder of your nuxt app, then check if you have a file at this location:

ls ./node_modules/@pinia/nuxt/node_modules/pinia/dist/pinia.mjs

Check if you have only one result for this command: npm list pinia. It should display something like this:

❯ npm list pinia
my-app@ /Users/me/projects/my-app
└─┬ @pinia/nuxt@0.4.2
  └── pinia@2.0.22

idk anymore, now it’s working without doing the alias for some reason 😅

The problem now is that when deploying (on netlify for example) pinia is actually needed…

yeah, it’s working well for me in dev mode, but getting issue with build or deploy on vercel

Was having the same issue. What worked for me was installing pinia by force lol

npm i pinia --force

After I tried many times solution worked steps： You need to remove “pinia” from package.json; （No “@pinia/nuxt”） After run : npm i pinia --force if you reinstall, you still need to remove “pinia” again;

I am getting the same error. - ERROR Cannot start nuxt: Cannot find module ‘@pinia/nuxt’

I tried all the above suggestions and still no fix.

I spotted the following change in tsconfig.json: the path for pinia moved from pinia/dist/pinia to node_modules/pinia/dist/pinia

@Lyokolux I’m getting the same error when I spin up the development server for the ‘first time’, but once I kill the process and start it again, the error is gone. Is it the same for you?

Yes, I am currently experiencing it. The server starts correctly though. I get a router is undefined with a warning [Vue warn]: injection "Symbol(router)" not found. (maybe related to https://github.com/nuxt/nuxt.js/issues/14595)

EDIT: after relaunching the server a third time, it works 🤔