This module cannot be imported in server runtime || og-image not showing

[Abdallah-Awwad]

The projects works fine but I'm getting this error whenever I try to rebuild it.

✔ Server built in 96167ms
ℹ Initializing prerenderer

[3:08:01 PM]  ERROR  This module cannot be imported in server runtime. [importing @nuxt/kit from node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected]_nux_undt3zhfvsokhebtqgy6i27fba/node_modules/nuxt-simple-sitemap/dist/runtime/util/pageUtils.mjs]

ℹ Prerendering 2 routes
  ├─ /__og-image__/font/Inter/700.ttf (55ms)
  ├─ /__og-image__/font/Inter/400.ttf (40ms)
ℹ Prerendered 2 routes in 47.356 seconds
✔ Generated public .output/public                                                                                                                                                                                         
ℹ Building Nuxt Nitro server (preset: node-server)

[3:09:09 PM]  ERROR  This module cannot be imported in server runtime. [importing node_modules/.pnpm/@[email protected]/node_modules/@nuxt/kit/dist/index.mjs from node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected]_nux_undt3zhfvsokhebtqgy6i27fba/node_modules/nuxt-simple-sitemap/dist/runtime/util/pageUtils.mjs]

Also note: after merging this PR #85 the link works as expected (not using the localhost anymore)
<meta property="og:image" content="https://mydomain.com/__og-image__/image/team/og.png">

But the og-image not appearing and gives me this error:
{ "url": "/__og-image__/image/og.png", "statusCode": 500, "statusMessage": "", "message": "Invalid JPEG", "stack": "" }

I'm not sure if they both are related, but any help would be appreciated.

Also, I would like to know where is the og-images stored in my server? because I can't see any of them created in the public path.

I'm selfhosting on Digital Ocean
Node version 20.12.2

[bryantgillespie]

Hmmm - based on the error maybe a dependency issue?

[bryantgillespie]

Have you tried updating dependencies?

[Abdallah-Awwad]

Yes, it appears to be a dependency issue. I resolved it by replacing @nuxtjs/sitemap instead of nuxt-simple-sitemap because its deprecated. I will submit a PR for this change.

[Abdallah-Awwad]

Regarding the og image, I suspect the issue may be related to the logo.vue component. Because when I replaced logo_on_dark_bg with an SVG image, it worked well in most cases. I plan to debug this further when time allows.

[leomiranda]

Yes, it appears to be a dependency issue. I resolved it by replacing @nuxtjs/sitemap instead of nuxt-simple-sitemap because its deprecated. I will submit a PR for this change.

Thank you, solved here too.