`__dirname` is not supported by cloudflare pages

[StefanH-AT]

Describe the bug

I'm trying to deploy a site on cloudflare pages and this module breaks because it's trying to resolve __dirname which is not supported by cloudflare pages

Reproduction

No response

System / Nuxt Info

No response

[DanSnow]

I've also encountered this issue. Upon further investigation, I found that the __dirname variable appears in the css-inline package

[harlan-zw]

Hi, looking into a fix for this. In the meantime, you can disable the cssInline or use version 2.0.x.

export default defineNuxtConfig({
  runtimeCompatibility: {
    cssInline: false
  }
})

[harlan-zw]

Hi, please use 2.1.2. The core issue isn't solved as I'm waiting for an upstream fix but if you don't need css inling it won't be a problem.

[StefanH-AT]

Never used runtimeCompatibility but it's showing errors in my ide and doesn't fix the issue either. I had to downgrade to 2.0.x

[DanSnow]

Hi @harlan-zw,

I tried version 2.1.2, but there are still issues. The problem occurs whenever we load css-inline. Simply disabling css-inline doesn't seem to be a viable solution.

Additionally, I've left a comment on the css-inline side. I've tested using wasm-pack, and on the Nuxt side, I had to make modifications to nuxt.config.ts like this to load the re-packaged css-inline without encountering errors.

import wasm from '@rollup/plugin-wasm'

defineNuxtConfig({
  nitro: {
    rollupConfig: {
      plugins: [wasm()],
    },
  },
})

However, I haven't tested whether css-inline is functioning correctly.

[harlan-zw]

Thanks for your help @DanSnow, I think there was a bug in disabling the cssInline compatibility for non-node environments. That should be fixed in 2.1.3.

If you're using Node you may have to provide the following:

ogImage: {
    runtimeCompatibility: {
      cssInline: false,
    },
}

Will continue to debug this and hopefully we can get it working for all environments soon.

[harlan-zw]

The core issue here is solved with the above workaround and should just work in v3 of the module.

I have made a new issue to track supporting css-inline in cloudflare pages https://github.com/harlan-zw/nuxt-og-image/issues/119