feat: Add default directives (#81)

* feat: Support for default directives

This feature lets you specify directives that should be applied by default to every image, enabling a workflow similar to traditional image optimization plugins. The `defaultDirectives`option can either be an object of directives or a function returning an object.

* test: add unit test for default directives

packages/rollup/src/index.ts

@@ -45,9 +45,13 @@ export function imagetools(userOptions: Partial<PluginOptions> = {}): Plugin {
             const outputMetadatas = []
 
             for (const config of imageConfigs) {
-                const { transforms, warnings } = generateTransforms(config, transformFactories)
+                const defaultConfig = typeof pluginOptions.defaultDirectives === 'function'
+                    ? pluginOptions.defaultDirectives(id)
+                    : pluginOptions.defaultDirectives
+
+                const { transforms, warnings } = generateTransforms({ ...defaultConfig, ...config }, transformFactories)
                 warnings.forEach(warning => this.warn(warning))
-                
+
                 const { image, metadata } = await applyTransforms(transforms, img, pluginOptions.removeMetadata)
 
                 const fileName = basename(src.pathname, extname(src.pathname)) + `.${metadata.format}`
@@ -71,7 +75,7 @@ export function imagetools(userOptions: Partial<PluginOptions> = {}): Plugin {
                     break
                 }
             }
-        
+
             return dataToEsm(outputFormat(outputMetadatas))
         },
         renderChunk(code) {

packages/rollup/src/types.ts

@@ -12,6 +12,12 @@ export interface PluginOptions {
     */
     exclude: Array<string | RegExp> | string | RegExp
 
+    /**
+     * This option allows you to specify directives that should be applied _by default_ to every image.
+     * You can also provide a function, in which case the function gets passed the asset ID and should return an object of directives
+     */
+     defaultDirectives?: Record<string, string> | ((id: string) => Record<string, string>)
+
     /**
      * You can use this option to extend the builtin list of import transforms.
      * This list will be merged with the builtin transforms before applying them to the input image.

packages/vite/src/index.ts

@@ -46,10 +46,14 @@ export function imagetools(userOptions: Partial<PluginOptions> = {}): Plugin {
 
             const outputMetadatas = []
 
-            for (const config of imageConfigs) {
+            for (let config of imageConfigs) {
                 const id = generateImageID(src, config)
 
-                const { transforms } = generateTransforms(config, transformFactories)
+                const defaultConfig = typeof pluginOptions.defaultDirectives === 'function'
+                    ? pluginOptions.defaultDirectives(id)
+                    : pluginOptions.defaultDirectives
+
+                const { transforms } = generateTransforms({ ...defaultConfig, ...config }, transformFactories)
                 const { image, metadata } = await applyTransforms(transforms, img, pluginOptions.removeMetadata)
 
                 generatedImages.set(id, image)

packages/vite/src/types.ts

@@ -15,6 +15,12 @@ export interface PluginOptions {
     */
     exclude: Array<string | RegExp> | string | RegExp
 
+    /**
+     * This option allows you to specify directives that should be applied _by default_ to every image.
+     * You can also provide a function, in which case the function gets passed the asset ID and should return an object of directives
+     */
+    defaultDirectives?: Record<string, string> | ((id: string) => Record<string, string>)
+
     /**
      * You can use this option to extend the builtin list of import transforms.
      * This list will be merged with the builtin transforms before applying them to the input image.