Environment
- @nuxt/image: v2.0.0
- Nuxt: 4.x
- TypeScript: strict mode
Description
The Img interface's call signature hardcodes ImageOptions without a generic parameter, which defaults to DefaultProvider (resolved from ProviderDefaults['provider']). This means the provider field in the options argument only accepts the default provider (e.g. "ipx"), even when other providers are properly configured.
Generated types (.nuxt/image/providers.d.ts):
interface ProviderDefaults {
provider: "ipx"
}
interface ConfiguredImageProviders {
"directus": ImageProviders["directus"]
"ipx": ImageProviders["ipx"]
}
Img interface (module.d.ts):
type DefaultProvider = ProviderDefaults extends Record<'provider', unknown> ? ProviderDefaults['provider'] : never;
interface ImageOptions<Provider extends keyof ConfiguredImageProviders = DefaultProvider> {
provider?: Provider; // defaults to "ipx"
}
interface Img {
(source: string, modifiers?: ImageOptions['modifiers'], options?: ImageOptions): ResolvedImage['url'];
// ^^^^^^^^^^^^
// ImageOptions without generic = ImageOptions<"ipx">, so provider?: "ipx"
}
Reproduction
Configure a non-default provider (e.g. directus) in nuxt.config.ts:
// nuxt.config.ts
export default defineNuxtConfig({
image: {
providers: {
directus: {
provider: 'directus',
options: {
baseURL: 'https://example.com/assets/',
},
},
},
},
})
Then use useImage() with that provider:
const img = useImage();
const url = img('some-id', {}, { provider: 'directus' });
// ^^^^^^^^^^
// TS2322: Type '"directus"' is not assignable to type '"ipx"'
Expected behavior
The provider option in Img's call signature should accept any key from ConfiguredImageProviders, not just the default provider.
Suggested fix
Make the Img interface generic or widen the provider type to accept all configured providers:
interface Img {
(source: string, modifiers?: ImageOptions['modifiers'], options?: ImageOptions<keyof ConfiguredImageProviders>): ResolvedImage['url'];
}
Workaround
import type { ImageOptions } from '@nuxt/image';
const directusOptions = { provider: 'directus' } as unknown as ImageOptions;
const url = img('some-id', {}, directusOptions);
Environment
Description
The
Imginterface's call signature hardcodesImageOptionswithout a generic parameter, which defaults toDefaultProvider(resolved fromProviderDefaults['provider']). This means theproviderfield in the options argument only accepts the default provider (e.g."ipx"), even when other providers are properly configured.Generated types (
.nuxt/image/providers.d.ts):Img interface (
module.d.ts):Reproduction
Configure a non-default provider (e.g.
directus) innuxt.config.ts:Then use
useImage()with that provider:Expected behavior
The
provideroption inImg's call signature should accept any key fromConfiguredImageProviders, not just the default provider.Suggested fix
Make the
Imginterface generic or widen theprovidertype to accept all configured providers:Workaround