@pinia/nuxt 0.7.0 error with fresh Nuxt project

[Pierre-Demessence]

Reproduction

https://codesandbox.io/p/devbox/lt39mc

Steps to reproduce the bug

1. npx nuxi@latest init
2. npx nuxi module add pinia
3. npm run dev

Expected behavior

The "Welcome to Nuxt!" page should appear.

Actual behavior

500
[vite-node] [ERR_LOAD_URL] pinia

at pinia

Additional information

Since Nuxt 3.14 is very new, I tried switching to 3.13 but that didn't help. Earlier versions are incompatibles due to 3dab0a6.

Switching to @pinia/nuxt@^0.5.5 fixed the issue.

[posva]

I tested locally with pnpm and it works fine. Let's track this at #2820
Using npm seems to install pinia within the @pinia/nuxt folder and this seems to create other issues down the line 😅 If you can, use pnpm instead, if not use npm i --legacy-peer-deps or npm i --force pinia

[davidsandoz]

I'm having the same issue, also with @pinia/nuxt 0.7.0, Nuxt 3.14, and using npm.

Downgrading to @pinia/nuxt 0.6.1, I don't have the issue any more.

#2820 seems to happen already with @pinia/nuxt 0.6.0 and specifically with pnpm. Is this really the same root cause? Or should the issue title of #2820 be adapted to be cover more use cases?

[davidsandoz]

Using npm seems to install pinia within the @pinia/nuxt folder and this seems to create other issues down the line 😅

On my end, I actually have pinia set as an explicit dependency in package.json (set to version ^2.2.6), so I have it at the root of node_modules.

Looking at your research output in #2820 (comment), I tried adding the alias in nuxt.config.ts and it eventually worked. I just had to replace
const rootDir = fileURLToPath(new URL('../..', import.meta.url));
with
const rootDir = fileURLToPath(new URL('.', import.meta.url));

[den15dev]

Got exactly the same issue today with Nuxt 3.13.2. Just ran npx nuxi@latest module add pinia, pinia 0.7.0 installed, '@pinia/nuxt' has been added to modules property of nuxt.config.js.

500
[vite-node] [ERR_LOAD_URL] pinia
at pinia

Downgrading to 0.6.1 didn't help.

Downgrading to 0.5.5 gave the error:

Cannot start nuxt: Cannot find module 'pinia/dist/pinia.mjs'

[Pierre-Demessence]

I can confirm using pnpm fixed the issue for me with @pinia/nuxt 0.7.0.

[jonathanunai]

I had the same error, I also use npm.

This solved it for me:

// package.json
"dependencies": {
"@pinia/nuxt": "^0.7.0",
"nuxt": "^3.14.159",
"pinia-plugin-persistedstate": "^4.1.3",
"vue": "latest",
"vue-router": "latest"
},
"overrides": {
"vue": "latest"
}

// nuxt.config.ts
modules: ['@pinia/nuxt'],
build: {
transpile: ['pinia-plugin-persistedstate'],
},

Then delete node_modules and package-lock.json.

[peterh-capella]

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

Added just this part of jonathanunai's suggestion and was able to start the Nuxt Welcome app. Now to try it on my development applications.

[nsina]

Issue appearing on Nuxt 3.14.159. Did we get a definite answer on the root cause?
Workarounds didn't solve the issue.

500
[vite-node] [ERR_LOAD_URL] pinia
at pinia

[den15dev]

I managed to make it work after the following two steps:

1. Install @pinia/nuxt:
   npx nuxi@latest module add pinia

2. Install pinia with the --force flag:
   npm i pinia --force

The --force flag is important, otherwise, it will output ERESOLVE errors ("Could not resolve dependency: pinia@"*" from the root project", "Conflicting peer dependency: [email protected]")

I don't want to switch to pnpm just for Pinia because I'm using Docker containers.

[Edanriell]

I managed to make it work after the following two steps:

1. Install @pinia/nuxt:
   npx nuxi@latest module add pinia
2. Install pinia with the --force flag:
   npm i pinia --force

The --force flag is important, otherwise, it will output ERESOLVE errors ("Could not resolve dependency: pinia@"*" from the root project", "Conflicting peer dependency: [email protected]")

I don't want to switch to pnpm just for Pinia because I'm using Docker containers.

Thx, u just saved my day !

[wenyanlin]

I managed to make it work after the following two steps:

1. Install @pinia/nuxt:
   npx nuxi@latest module add pinia
2. Install pinia with the --force flag:
   npm i pinia --force

The --force flag is important, otherwise, it will output ERESOLVE errors ("Could not resolve dependency: pinia@"*" from the root project", "Conflicting peer dependency: [email protected]")

I don't want to switch to pnpm just for Pinia because I'm using Docker containers.

This works for me. Thanks.

[Mursvolungur]

I managed to make it work after the following two steps:

1. Install @pinia/nuxt:
   npx nuxi@latest module add pinia
2. Install pinia with the --force flag:
   npm i pinia --force

The --force flag is important, otherwise, it will output ERESOLVE errors ("Could not resolve dependency: pinia@"*" from the root project", "Conflicting peer dependency: [email protected]")

I don't want to switch to pnpm just for Pinia because I'm using Docker containers.

Had the same issue, this solution worked for me too on a Mac, thank you

[arshx86]

I managed to make it work after the following two steps:

1. Install @pinia/nuxt:
   npx nuxi@latest module add pinia
2. Install pinia with the --force flag:
   npm i pinia --force

The --force flag is important, otherwise, it will output ERESOLVE errors ("Could not resolve dependency: pinia@"*" from the root project", "Conflicting peer dependency: [email protected]")

I don't want to switch to pnpm just for Pinia because I'm using Docker containers.

Thanks, worked.