[nuxt3][vercel] Feature request: Support vercel provider for static app (nuxt generate)

[hartmut-co-uk]

Feature

Feature request: Support (nuxt3) nuxt/image with vercel provider for static app -> nuxt generate.

Expected

Vercel config is generated and contains the "images" property which configures the Image Optimization feature.

Actual

Website is generated, <nuxt-image> components are processed fine, but vercel config does not contain the "images" property.

Reproduction example

https://github.com/hartmut-co-uk/nuxt3-generate-static-vercel-image

[mrdannyjohnson]

@hartmut-co-uk This may be happening because static image generation is not supported yet (4th checkbox): https://github.com/nuxt/image/discussions/548

[hartmut-co-uk]

Many thanks for the ref @mrdannyjohnson!

I'd guess this work item would mean image variants (srcset) are actually generated + packaged at pre-render ('generate') time using e.x. IPX?

Basically I might even prefer this option - but as far as this issue is concerned the Vercel Image Optimization(https://vercel.com/docs/concepts/image-optimization) should be used. Basically the website is static, pre-rendered - but using vercel images, like when running on nitro, SSR..

Example

1. nuxt3 default using nuxt build, nitro, SSR via vercel edge function
   -> https://nuxt3-generate-static-vercel-image-lb046wh8w-info301.vercel.app/)
2. vs. result of nuxt generate
   -> https://nuxt3-generate-static-vercel-image-7scsed04t-info301.vercel.app/

[danielroe]

Have you tried setting provider: 'vercel' in your image config?

[hartmut-co-uk]

hah! And I thought something from this reproduction example was different from my actual project...

I've created following branch to show the state with provider: 'vercel': image-provider-vercel => vercel deployed as https://nuxt3-generate-static-vercel-image-lxienje6o-info301.vercel.app/

PS: Further I have changed the vercel project settings, see screenshot in branch README.. now using 'yarn generate' and default output directory. (this shouldn't make any difference though)

The generated image src/srcset now show correct use of vercel path... but what's missing as stated in initial post seems to be

Vercel config is generated and contains the "images" property

[hartmut-co-uk]

any pointers which repo/package this actually would need to be solved with?

• https://github.com/nuxt/framework ?
• https://github.com/unjs/nitro ?

[hartmut-co-uk]

The page in question has only a hand full of routes, as some sort of workaround, I was able to solve what I was trying to achieve by simply configuring all my routes for prerender:

    nitro: {
        prerender: {
            routes: ['/', '/a', '/b', '/c']
        }
    },

It's deployed to vercel and not served via nitro functions but static as expected. Vercel image provider is still getting configured and working.

ℹ️ I'll keep the issue open, since I think it would still be good to have vercel image provider working with nuxt generate.