rsbuild-plugin-sharp-image-optimizer

A Rsbuild plugin for image optimization based on Sharp, supporting image format conversion and quality compression.

Features

• 🖼️ Multiple image format conversion support (JPEG, PNG, WebP, AVIF)
• 📦 Automatic image quality and size optimization
• ⚡️ Powered by high-performance Sharp image processing library
• 🔧 Configurable compression parameters

Installation

npm install rsbuild-plugin-sharp-image-optimizer --save-dev
# or
yarn add rsbuild-plugin-sharp-image-optimizer -D
# or
pnpm add rsbuild-plugin-sharp-image-optimizer -D

Usage

Add the plugin to your Rsbuild configuration:

import { sharpImageOptimizer } from 'rsbuild-plugin-sharp-image-optimizer';

sharpImageOptimizer({
  test: /\.(jpe?g|png|webp)$/i, // Pattern to match image files
  quality: 75, // Image quality (1-100)
  effort: 6, // Compression effort level (0-9)
  format: 'avif', // Output format: 'jpeg', 'png', 'webp', 'avif'
});

Options

| Option | Type | Default | Description | | ------- | -------- | -------------------------- | --------------------------------------------- | | test | RegExp | /\.(jpe?g\|png\|webp)$/i | Pattern for matching image files to process | | quality | number | 75 | Output image quality (1-100) | | effort | number | 6 | Compression effort level (0-9) | | format | string | - | Output format ('jpeg', 'png', 'webp', 'avif') |

Notes

• If no format is specified, the original image format will be preserved
• Higher quality values result in larger file sizes
• Higher effort values increase processing time but may achieve better compression results
• The plugin automatically handles image optimization during the build process
• Supports modern image formats like WebP and AVIF for better web performance

License

MIT