diff --git a/src/ipx.ts b/src/ipx.ts index 1298414b9..3b9e7157a 100644 --- a/src/ipx.ts +++ b/src/ipx.ts @@ -33,6 +33,7 @@ export const ipxSetup: ProviderSetup = async (_providerOptions, moduleOptions) = route: '/_ipx/**', handler: resolver.resolve('./runtime/ipx') }) + return } // Add as dev handler for development diff --git a/src/runtime/components/nuxt-img.ts b/src/runtime/components/nuxt-img.ts index 13bff96fe..b58401e44 100644 --- a/src/runtime/components/nuxt-img.ts +++ b/src/runtime/components/nuxt-img.ts @@ -1,8 +1,9 @@ import { h, defineComponent, ref, computed, onMounted } from 'vue' +import { appendHeader } from 'h3' import { useImage } from '../composables' import { parseSize } from '../utils' import { baseImageProps, useBaseImage } from './_base' -import { useHead } from '#imports' +import { useHead, useRequestEvent } from '#imports' export const imgProps = { ...baseImageProps, @@ -85,6 +86,14 @@ export default defineComponent({ }) } + if (process.env.prerender) { + const sources = [ + src.value, + ...(sizes.value.srcset || '').split(',').map(s => s.split(' ')[0]) + ].filter(s => s && s.includes('/_ipx/')) + appendHeader(useRequestEvent(), 'X-Nitro-Prerender', sources.join(',')) + } + const imgEl = ref(null) onMounted(() => { diff --git a/src/runtime/ipx.ts b/src/runtime/ipx.ts index 88571f462..6d7241791 100644 --- a/src/runtime/ipx.ts +++ b/src/runtime/ipx.ts @@ -8,7 +8,8 @@ export default lazyEventHandler(() => { const ipxOptions = { ...(useRuntimeConfig().ipx || {}), // TODO: Switch to storage API when ipx supports it - dir: fileURLToPath(new URL('../public', import.meta.url)) + // TODO: Using relative paths for POC only + dir: fileURLToPath(new URL(process.env.prerender ? '../../.output/public' : '../public', import.meta.url)) } const ipx = createIPX(ipxOptions)