feat: module config .format, last entry used for nuxt-image

docs/content/5.configuration.md

@@ -49,9 +49,11 @@ export default defineNuxtConfig({
 
 Default: `['webp']`
 
-You can use this option to configure the default format for your images used by `<nuxt-picture>`. The available formats are `webp`, `avif`, `jpeg`, `jpg`, `png`, and `gif`. The order of the formats is important, as the first format that is supported by the browser will be used. You can pass multiple values like `['avif', 'webp']`.
+You can use this option to configure the default format for your images used by `<nuxt-picture>` and `<nuxt-image>`. Multiple values like `['avif', 'webp']` can be passed. The order of the formats is important, as for `<nuxt-picture>`, the first format that is supported by the browser will be rendered. For `<nuxt-image>` on the other hand, the _first_ element of the array is used (ignoring browser support).
 
-You can also override this option at the component level by using the [`format` prop.](/components/nuxt-picture#format)
+Available formats are `webp`, `avif`, `jpeg`, `jpg`, `png`, and `gif`.
+
+You can also override this option at the component level by using `format` prop ([<nuxt-image>](/components/nuxt-image#format)|[<nuxt-picture>](/components/nuxt-picture#format)).
 
 ```ts [nuxt.config.ts]
 export default defineNuxtConfig({

src/runtime/components/_base.ts

@@ -96,7 +96,7 @@ export const useBaseImage = (props: ExtractPropTypes<typeof baseImageProps>) =>
       ...props.modifiers,
       width: parseSize(props.width),
       height: parseSize(props.height),
-      format: props.format,
+      format: props.format || $img.options.format.length ? $img.options.format[0] : undefined,
       quality: props.quality || $img.options.quality,
       background: props.background,
       fit: props.fit