feat(images): image formats and quality configurable

Author: luksak

.playground/app.config.ts

@@ -1,5 +1,22 @@
+import type { ImageConfiguration } from '../types'
+
 export default defineAppConfig({
   attributeContent: {
     name: 'Nuxt Attribute Content (overwritten)',
+    images: (): ImageConfiguration => {
+      const images = {
+        formats: [
+          {
+            format: 'avif',
+            quality: 70,
+          },
+          {
+            format: 'webp',
+            quality: 85,
+          },
+        ],
+      }
+      return images
+    },
   },
 })

app.config.ts

@@ -1,13 +1,17 @@
 export default defineAppConfig({
   attributeContent: {
     name: 'Nuxt Attribute Content',
+    images: {
+      formats: [
+        {
+          format: 'avif',
+          quality: 60,
+        },
+        {
+          format: 'webp',
+          quality: 75,
+        },
+      ],
+    },
   },
 })
-
-declare module '@nuxt/schema' {
-  interface AppConfigInput {
-    attributeContent?: {
-      name?: string
-    }
-  }
-}

types/index.d.ts

@@ -0,0 +1,28 @@
+export interface ImageFormat {
+  format: string
+  quality: number
+}
+
+export interface ImageConfiguration {
+  formats: ImageFormat[]
+}
+
+export type ImageConfigValue = ImageConfiguration | (() => ImageConfiguration)
+
+declare module '@nuxt/schema' {
+  interface AppConfigInput {
+    attributeContent?: {
+      name?: string
+      images?: ImageConfigValue
+    }
+  }
+  interface AppConfig {
+    attributeContent: {
+      name: string
+      images: ImageConfiguration
+    }
+  }
+}
+
+// It is always important to ensure you import/export something when augmenting a type
+export {}