[Question] How to use `NuxtImg` with `hubBlob`?

[ra-jeev]

Is it possible to use NuxtImg with hubBlob?

In my app I created a server route for /images path and serving the images from there (just like the starter template) as shown below

// inside /server/routes/images/[...pathname].ts
export default defineEventHandler(async (event) => {
  const { pathname } = event.context.params || {};

  return hubBlob().serve(event, pathname);
});

This of course doesn't work with NuxtImg as it says that for relative paths the images should be in the /public folder. Is there a way to make it work in this scenario?

[ra-jeev]

Looks like even without hubBlob it doesn't work as is evident from this issue. Will it automatically work in the above scenario when the mentioned issue is fixed in NuxtImg?

[Atinux]

Hey @ra-jeev

It is not possible at the moment for two reasons:

• Nuxt Image needs to pull images from the public/ directory
• IPX (default image transformer) does not work inside Cloudflare Workers for now

One solution might be to take a look at Cloudflare Images

[ra-jeev]

Thanks for the info @Atinux. Will need to try out the Cloudflare preset with @nuxt/Image.

Is there any plan to connect NuxtHub with Cloudflare Images in future? Maybe we can close this issue if there is no such plan.

[Atinux]

Is there any plan to connect NuxtHub with Cloudflare Images in future

Yes we do! I though that it would be possible directly with having a transformer running in the worker. Will keep you posted.