nuxt-modules / og-image

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

Compatibility for `cloudflare_module` preset of Nitro #143

Closed bianpratama closed 8 months ago

bianpratama commented 8 months ago

Thank you for the amazing modules, the SEO package is helping me and my team head start our SEO journey 🙏🏻

I want to report an issue that might be a feature request, instead of a bug.

Nitro has 3 presets for Cloudflare: cloudflare, cloudflare-pages, and cloudflare_module. And I'm using Nuxt with the cloudflare_module preset.

I found an error when the module tried to fetch font assets. And I'm not using any custom fonts, so it's just the default Inter font. Below is the log from Cloudflare Workers:

{
  "message": [
    "[nuxt] [request error] [unhandled] [522]",
    "[GET] \"https://lite.uji.neon.id/__og-image__/font/Inter/700.ttf\": 522 \n  at async $fetch2 (index.js:53290:13)  \n  at async loadFont (index.js:45528:32)  \n  at async Promise.all (index 1)  \n  at async createSvg (index.js:47106:14)  \n  at async createPng (index.js:47110:65)  \n  at async index.js:51825:19  \n  at async Object.handler (index.js:53124:21)  \n  at async index.js:53201:7  \n  at async index.js:58243:25"
  ],
  "level": "error",
  "timestamp": 1705140201134
}

Currently, compatibility. ts only handles cloudflare and cloudflare-pages. I have tried to override the compatibility config provided by the module. However, some internal behaviors cannot be easily overridden. For instance, on this line https://github.com/nuxt-modules/og-image/blob/main/src/module.ts#L475C7-L478C14.

{
  compatibility: {
    prerender: { chromium: false },
    runtime: {
      chromium: false,
      'css-inline': false,
      resvg: 'wasm-fs',
      satori: 'node',
      sharp: false,
    },
  }
}

Is it possible that this module also supports the cloudflare_module preset?

harlan-zw commented 8 months ago

Available in nuxt-og-image@3.0.0-rc.26, lmk if there's issue