Beta version broken since 2.0.0-beta.22

[tmlmt]

Describe the bug

Hey Harlan, things have not transitioned well since the latest bump of nuxt-of-image on my project. I have been able to trace the issue back to transitioning from beta.21 (which works) to beta.22 and things still don't work with beta.29. I'm not sure what is the exact cause and it might be multiple bugs but I can at least describe the symptoms I experience below:

In my minimal repro (see link below)

error_01 When building the app, I see the following errors at the Building Nitro Server (preset: node-server) step:

Export "useNitroApp" of module "node_modules/nitropack/dist/runtime/app.mjs" was reexported through module "node_modules/nitropack/dist/runtime/index.mjs" while both modules are dependencies of each other and will end up in different chunks by current Rollup settings. This scenario is not well supported at the moment as it will produce a circular dependency between chunks and will likely lead to broken execution order.
Either change the import in "node_modules/nuxt-og-image/dist/runtime/nitro/routes/html.mjs" to point directly to the exporting module or reconfigure "output.manualChunks" to ensure these modules end up in the same chunk.
Export "useNitroApp" of module "node_modules/nitropack/dist/runtime/app.mjs" was reexported through module "node_modules/nitropack/dist/runtime/index.mjs" while both modules are dependencies of each other and will end up in different chunks by current Rollup settings. This scenario is not well supported at the moment as it will produce a circular dependency between chunks and will likely lead to broken execution order.
Either change the import in "node_modules/nuxt-og-image/dist/runtime/nitro/routes/options.mjs" to point directly to the exporting module or reconfigure "output.manualChunks" to ensure these modules end up in the same chunk.
Export "useNitroApp" of module "node_modules/nitropack/dist/runtime/app.mjs" was reexported through module "node_modules/nitropack/dist/runtime/index.mjs" while both modules are dependencies of each other and will end up in different chunks by current Rollup settings. This scenario is not well supported at the moment as it will produce a circular dependency between chunks and will likely lead to broken execution order.
Either change the import in "node_modules/nuxt-og-image/dist/runtime/nitro/renderers/satori/plugins/imageSrc.mjs" to point directly to the exporting module or reconfigure "output.manualChunks" to ensure these modules end up in the same chunk.
Export "useNitroApp" of module "node_modules/nitropack/dist/runtime/app.mjs" was reexported through module "node_modules/nitropack/dist/runtime/index.mjs" while both modules are dependencies of each other and will end up in different chunks by current Rollup settings. This scenario is not well supported at the moment as it will produce a circular dependency between chunks and will likely lead to broken execution order.
Either change the import in "node_modules/nuxt-og-image/dist/runtime/nitro/renderers/satori/index.mjs" to point directly to the exporting module or reconfigure "output.manualChunks" to ensure these modules end up in the same chunk.
Export "useNitroApp" of module "node_modules/nitropack/dist/runtime/app.mjs" was reexported through module "node_modules/nitropack/dist/runtime/index.mjs" while both modules are dependencies of each other and will end up in different chunks by current Rollup settings. This scenario is not well supported at the moment as it will produce a circular dependency between chunks and will likely lead to broken execution order.
Either change the import in "node_modules/nuxt-og-image/dist/runtime/nitro/utils.mjs" to point directly to the exporting module or reconfigure "output.manualChunks" to ensure these modules end up in the same chunk.

error_02 When starting the app, I immediately get the following error: [nitro] [dev] [unhandledRejection] TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".wasm" for /home/tmlmt/dev/nuxt-starter-3ueqlw/.output/server/chunks/rollup/resvg.wasm

error_03 The index page still loads, but when I then try to reach http://localhost:3000/__og_image__/og.png, it loads indefinitely, and I get the following error in server logs:

(node:26333) PromiseRejectionHandledWarning: Promise rejection was handled asynchronously (rejection id: 2)
(Use `node --trace-warnings ...` to show where the warning was created)
[Vue Router warn]: No match found for location with path "/resvg.wasm"
[Vue Router warn]: No match found for location with path "/resvg.wasm"
[Vue Router warn]: No match found for location with path "/resvg.wasm"
[Vue Router warn]: No match found for location with path "/resvg.wasm"
[Vue Router warn]: No match found for location with path "/resvg.wasm"
[Vue Router warn]: No match found for location with path "/resvg.wasm"
[Vue Router warn]: No match found for location with path "/resvg.wasm"
[Vue Router warn]: No match found for location with path "/resvg.wasm"
[nitro] [dev] [unhandledRejection] FetchError:  (404 Page not found: /resvg.wasm (http://localhost:3000/resvg.wasm))

In my production app

I get the same TypeError at start-up, and then the following error on any __og_image__/og.png

Reproduction

https://stackblitz.com/edit/nuxt-starter-3ueqlw

Steps

• download the stackblitz package locally
• npm i
• npm run build : see error_01 above
• node .output/server/index.mjs: see error_02 above
• browse to http://localhost:3000/__og_image__/og.png: see error_03 above

Workaround

I have rolled back to 2.0.0-beta.21 for the time being

System / Nuxt Info

------------------------------
- Operating System: Linux
- Node Version:     v16.19.0
- Nuxt Version:     3.4.3
- Nitro Version:    2.3.3
- Package Manager:  npm@8.19.3
- Builder:          vite
- User Config:      app, extends, appConfig, css, postcss, build, modules, runtimeConfig, auth, content, i18n, image, nitro, routeRules, robots, security, vite
- Runtime Modules:  @sidebase/nuxt-auth@0.4.4, @nuxtjs/i18n@8.0.0-beta.11, @pinia/nuxt@0.4.9, @vueuse/nuxt@9.13.0, @nuxt/image-edge@1.0.0-28020728.5df24eb, @nuxt/content@2.6.0, nuxt-simple-sitemap@2.4.18, nuxt-simple-robots@2.2.4, nuxt-og-image@2.0.0-beta.29, nuxt-security@0.13.0
- Build Modules:    -
------------------------------

[harlan-zw]

Hey @tmlmt, thank you for the detailed issue.

The beta.22 version introduced a compatibility table for each Nitro runtime and how they load the web assembly files. The default loading strategy was set to import which Node can't handle. 2.0.0-beta.30 is updated to use fetch for node-server which looks like it solves the issue.

You can safely ignore the nitro warning, I'll try and get them fixed soon.

Let me know if you still have any issues

[tmlmt]

Thanks a lot @harlan-zw ! It works now.

[tmlmt]

Hey @harlan-zw, weird stuff. I cried victory too early, the problem is still here in my production app (same 500 error: ). Doesn't work from beta.22 to beta.40. Had to revert to beta.21 to work again.

I'm deploying on my own server with node v16, with pm2. No pre-rendered routes, all SSR.