[]previous and next page

ImageVariantsOptions

Options of imageVariants.

Options of imageVariants.

Import#

ts
import type { ImageVariantsOptions } from "@shadow-js/dusk/vite";

Signature#

ts
interface ImageVariantsOptions {
  /** The widths to make, in CSS pixels. A width at or above the image's own is replaced by the image's width. Default `[640, 960, 1280, 1920]`. */
  readonly widths?: readonly number[];
  /** The formats to make. Default `["avif", "webp"]`. */
  readonly formats?: readonly ("avif" | "webp")[];
  /** Encoder quality, 1 to 100. Default 50 for AVIF and 75 for WebP. */
  readonly quality?: { readonly avif?: number; readonly webp?: number };
  /**
   * Globs of paths under `public/` that are prepared even when no source file mentions them (`images/hero/**`). By
   * default only an image whose path appears in the source (`src/`, `index.html`) is prepared.
   */
  readonly include?: readonly string[];
  /** Files smaller than this many bytes are left alone: a variant would save nothing. Default 4096. */
  readonly minBytes?: number;
  /**
   * An original over this many bytes is named in a warning at the end of the build. `0` turns the warning off.
   * Default 1 MiB.
   */
  readonly maxOriginalBytes?: number;
  /** The folder of the files under the build's assets folder. Default `img`. */
  readonly directory?: string;
  /** Where finished files are kept between builds. Default: `dusk-images` in Vite's cache folder. */
  readonly cacheDir?: string;
  /**
   * The image library: a factory (your own `sharp` instance), or the name of the module to import it from. Default
   * `"sharp"`, an optional peer dependency.
   */
  readonly sharp?: string | SharpOpen;
}

Members#

Name Type Description
widths? readonly widths?: readonly number[] The widths to make, in CSS pixels. A width at or above the image's own is replaced by the image's width. Default [640, 960, 1280, 1920].
formats? readonly formats?: readonly ("avif" | "webp")[] The formats to make. Default ["avif", "webp"].
quality? readonly quality?: { readonly avif?: number; readonly webp?: number } Encoder quality, 1 to 100. Default 50 for AVIF and 75 for WebP.
include? readonly include?: readonly string[] Globs of paths under public/ that are prepared even when no source file mentions them (images/hero/**). By default only an image whose path appears in the source (src/, index.html) is prepared.
minBytes? readonly minBytes?: number Files smaller than this many bytes are left alone: a variant would save nothing. Default 4096.
maxOriginalBytes? readonly maxOriginalBytes?: number An original over this many bytes is named in a warning at the end of the build. 0 turns the warning off. Default 1 MiB.
directory? readonly directory?: string The folder of the files under the build's assets folder. Default img.
cacheDir? readonly cacheDir?: string Where finished files are kept between builds. Default: dusk-images in Vite's cache folder.
sharp? readonly sharp?: string | SharpOpen The image library: a factory (your own sharp instance), or the name of the module to import it from. Default "sharp", an optional peer dependency.