Error no such file or directory - debug.json

[modbender]

Just till recently (less than a week ago) I had no problem using @nuxtjs/seo, but suddenly using the package gives me error:

Environment:

WSL Ubuntu (Windows 11)

---

• Operating System: Linux
• Node Version: v21.7.1
• Nuxt Version: 3.10.3
• CLI Version: 3.10.1
• Nitro Version: -
• Package Manager: [email protected]
• Builder: -
• User Config: devtools, modules, colorMode
• Runtime Modules: @nuxtjs/[email protected], [email protected], @nuxtjs/[email protected]
• Build Modules: -

---

"devDependencies": {
    "@nuxtjs/color-mode": "^3.3.2",
    "@nuxtjs/seo": "2.0.0-rc.8",
    "nuxt-bootstrap-css": "^1.1.0",
    "nuxt": "^3.10.3",
    "vue": "^3.4.21",
    "vue-router": "^4.3.0"
}

Error

Error when using yarn:

[nitro 7:40:49 PM] ERROR Error: Could not load raw:/home/matrix/projects/nuxt/nuxt-project/node_modules/nuxt-og-image/dist/runtime/nitro/routes/debug.json (imported by virtual:#internal/nitro/virtual/server-handlers): ENOENT: no such file or directory, open '/home/matrix/projects/nuxt/nuxt-project/node_modules/nuxt-og-image/dist/runtime/nitro/routes/debug.json'

Error when using pnpm:

[nitro 8:34:04 PM] ERROR Error: Could not load raw:/home/matrix/projects/nuxt/nuxt-project/node_modules/.pnpm/nuxt-og-image@3.0.0-rc.42_@lezer+common@1.2.1_@nuxt+devtools@1.0.8_@vue[email protected]__5jsibe7fmeqasy2foxnj4ksb7y/node_modules/nuxt-og-image/dist/runtime/nitro/routes/debug.json (imported by virtual:#internal/nitro/virtual/server-handlers): ENOENT: no such file or directory, open '/home/matrix/projects/nuxt/nuxt-project/node_modules/.pnpm/nuxt-og-image@3.0.0-rc.42_@lezer+common@1.2.1_@nuxt+devtools@1.0.8_@vue[email protected]__5jsibe7fmeqasy2foxnj4ksb7y/node_modules/nuxt-og-image/dist/runtime/nitro/routes/debug.json'

---

Reproduction steps

1. Simply create a new project npx nuxi@latest init <project-name>
2. Install Nuxt SEO pnpm add -D @nuxtjs/seo and add it to modules
3. Run pnpm dev.

---

What's in the installation

I went ahead and checked the installation path of nuxt-og-image, and indeed it seems like there's no debug.json, I don't know if .d.ts and .mjs gets resolved into debug.json though

---

Things I have tried

I have tried switching from pnpm to yarn.

I have tried previous versions of nuxt, vue, vue-router

I have tried previous versions:

"@nuxtjs/seo": "2.0.0-rc.7",

"@nuxtjs/seo": "2.0.0-rc.8",

I have also tried some old versions of nuxt-og-image. I know the current version is "nuxt-og-image": "3.0.0-rc.42"
and I have tried till rc.37, which was part of a different project that WAS working perfectly fine...

"resolutions": {
  "nuxt-og-image": "3.0.0-rc.37"
}

I have also seen a similar issue and tried steps from it

At the end this might be an issue related to this project or not, but hoping I get some help.

[dargmuesli]

og-image/src/module.ts

Line 341 in 6c8936d

handler: resolve('./runtime/nitro/routes/debug.json'),

Maybe it should be debug.json.mjs here?

[dargmuesli]

Ah, no, it's most likely related to nitro v2.9.2 including this PR: unjs/nitro#2229

[modbender]

Ok looks like it indeed is nitro problem.

WORKAROUND AS BELOW

Add one of the below to package.json

"resolutions": {
  "nitropack": "2.9.1"
}

OR

"overrides": {
  "nitropack": "2.9.1"
}

Next, run npm install or whichever CLI you use.

[CODE-BR3AKER]

Ok looks like it indeed is nitro problem. Doing the below fixed it:

"resolutions": {
  "nitropack": "2.9.1"
}

where did you add this, can you explain ? @modbender

[dargmuesli]

!!!!! +++,

relax a bit please

then this error out of nowhere

without updating nitropack this issue should not occur

As you can see people are working on fixing that issue, please upvote the issue by giving it a 👍 instead of commenting without further information 🙏

where did you add this

To the package.json

[modbender]

@CODE-BR3AKER add it to package.json

Example from my project

{
  "name": "nuxt-app",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "devDependencies": {
    "@nuxtjs/color-mode": "^3.3.2",
    "@nuxtjs/seo": "2.0.0-rc.8",
    "nuxt": "^3.10.3",
    "nuxt-bootstrap-css": "^1.1.0",
    "nuxt-icon": "^0.6.9",
    "sass": "^1.71.1",
    "vue": "^3.4.21",
    "vue-router": "^4.3.0"
  },
  "resolutions": {
    "nitropack": "2.9.1"
  }
}

[CODE-BR3AKER]

Sorry I just been debuging this issue for 2 hours & I cannot seem to fix it :/

I tried btw your proposed solution + removed node_modules, pkg lock , did a fresh npm install, but still same issue. ( I see somehow that nuxt dev ignores the resolutions & uses nitro 2.9.2)
Any help is truly appreciated 🙏

[modbender]

You have to add it to package.json and run install npm install or yarn install or pnpm install

[dargmuesli]

Call it overrides instead of resolutions (https://stackoverflow.com/a/67397982)

(@harlan-zw please mark those comments as offtopic)

[dargmuesli]

Here's the Nuxt issue: nuxt/nuxt#26168

[dargmuesli]

Again, please upvote the issue by giving it a 👍 instead of commenting without further information 🙏

[dargmuesli]

There no need to have this issue in a personal project, a workaround has been provided above.

@danielroe if I may ask for some moderation on the comments above at your discretion? Thanks 🙌

[pi0]

Regression re json should be fixed in latest nitro release (unjs/nitro#2239)