nuxt-modules / og-image

Generate OG Images with Vue templates in Nuxt.
https://nuxtseo.com/og-image
400 stars 25 forks source link

Bun incompatibility #112

Open nathanchase opened 10 months ago

nathanchase commented 10 months ago

Describe the bug

Works great running nuxi dev locally.

On production, the URL is populated correctly: <meta property="og:image" content="https://www.mydomain.com/sharepage/__og_image__/og.png">

but if I go to that URL directly, I get a 500 error:

[nuxt] error caught during app initialization Error: Page not found: /sharepage/__og_image__/og.png
    at Gi (entry.acb9a3ca.js:1:119961)
    at entry.acb9a3ca.js:13:9639
    at r (entry.acb9a3ca.js:1:95258)
    at Object.runWithContext (entry.acb9a3ca.js:1:39867)
    at by (entry.acb9a3ca.js:1:95288)
    at entry.acb9a3ca.js:1:93934
    at Cu.run (entry.acb9a3ca.js:1:3586)
    at Object.runWithContext (entry.acb9a3ca.js:1:93926)
    at entry.acb9a3ca.js:13:9617
    at entry.acb9a3ca.js:5:20672
entry.acb9a3ca.js:14 Failed to create og image: undefined is not an object (evaluating 't.type')

My nuxt.config:

site: {
  url: import.meta.env.NUXT_PUBLIC_SITE_URL || 'https://www.mydomain.com'
},
ogImage: {
  runtimeSatori: true,
},

Reproduction

https://stackblitz.com/edit/github-r8fu9x?file=components%2FOgImage.vue

System / Nuxt Info

------------------------------
- Operating System: Linux
- Node Version:     v20.9.0
- Nuxt Version:     3.8.1
- CLI Version:      3.9.0-1694773088.8039b88
- Nitro Version:    2.7.2
- Package Manager:  bun@1.0.11
- Builder:          -
- User Config:      telemetry, devtools, modules, schemaOrg, nitro, vue, ogImage, image, experimental, routeRules, pwa, hooks, postcss, site, runtimeConfig, typescript, imports, router, vite
- Runtime Modules:  @pinia/nuxt@0.5.1, @pinia-plugin-persistedstate/nuxt@1.2.0, @vite-pwa/nuxt@0.2.3, @vueuse/nuxt@10.6.1, @nuxt/image@1.0.0, @nuxtjs/device@3.1.1, @nuxtjs/fontaine@0.4.1, floating-vue/nuxt, nuxt-og-image@2.2.4, nuxt-schema-org@3.1.8
------------------------------
nathanchase commented 10 months ago

Here's a reproduction of what I'm trying to accomplish: https://stackblitz.com/edit/github-r8fu9x?file=components%2FOgImage.vue

It's pulling two images, processing them using Nuxt Image, and then creating the component template for defineOgImage.

nathanchase commented 10 months ago

Found the culprit - it seems like nuxt-og-image (and Santori, at least) is not currently compatible with Bun. As soon as I switched to just regular Node 20, it works. Feel free to close this if you like, but know that Bun compatibility is the bigger issue.

harlan-zw commented 10 months ago

Thanks, I'll test out the v3 release with Bun when I get to that. It's likely it's related to some WASM behavior but if it's on my end I can fix it.