From 964dbe7195e6661c3bef41bfae81fdf57e1f01bd Mon Sep 17 00:00:00 2001 From: neverland Date: Tue, 15 Apr 2025 11:30:12 +0800 Subject: [PATCH] feat: allow to use with Rspack --- README.md | 48 ++++++++++++++++++++++++++++++++++++++++++++++++ src/index.ts | 2 ++ 2 files changed, 50 insertions(+) diff --git a/README.md b/README.md index 0268d52..c738441 100644 --- a/README.md +++ b/README.md @@ -31,6 +31,8 @@ export default { }; ``` +This plugin is compatible with both Rsbuild and Rspack. If you are using Rspack instead of Rsbuild, you can import the `ImageMinimizerPlugin` from the package, see [Rspack Usage](#rspack-usage). + ## Default Compressors By default, the plugin will enable `jpeg`, `png`, `ico` image compressors, which are equivalent to the following two examples: @@ -98,6 +100,52 @@ For example, the `png` compressor will take precedence over the `pngLossless` co pluginImageCompress(["jpeg", "pngLossless", "ico", "png"]); ``` +## Rspack Usage + +The plugin is also compatible with Rspack. + +If you are using Rspack instead of Rsbuild, you can import the `ImageMinimizerPlugin` from the package, use it in the [optimization.minimizer](https://rspack.dev/config/optimization#optimizationminimizer) array. + +```ts +// rspack.config.mjs +import { ImageMinimizerPlugin } from "@rsbuild/plugin-image-compress"; +import { defineConfig } from "@rspack/cli"; + +export default defineConfig({ + mode: process.env.NODE_ENV === "production" ? "production" : "development", + optimization: { + minimizer: [ + // Use `...` to preserve the default JS and CSS minimizers of Rspack + '...', + // Add the image minimizer plugins + new ImageMinimizerPlugin({ + use: "jpeg", + test: /\.(?:jpg|jpeg)$/, + }), + new ImageMinimizerPlugin({ + use: "png", + test: /\.png$/, + maxQuality: 50, + }), + new ImageMinimizerPlugin({ + use: "avif", + test: /\.avif$/, + quality: 80, + }), + new ImageMinimizerPlugin({ + use: "svg", + test: /\.svg$/, + floatPrecision: 2, + }), + new ImageMinimizerPlugin({ + use: "ico", + test: /\.(?:ico|icon)$/, + }), + ], + }, +}); +``` + ## License [MIT](./LICENSE). diff --git a/src/index.ts b/src/index.ts index e7d1fcd..f8b9277 100644 --- a/src/index.ts +++ b/src/index.ts @@ -35,6 +35,8 @@ const normalizeOptions = (options: Options[]) => { export const PLUGIN_IMAGE_COMPRESS_NAME = 'rsbuild:image-compress'; +export { ImageMinimizerPlugin }; + /** Options enable by default: {@link DEFAULT_OPTIONS} */ export const pluginImageCompress: IPluginImageCompress = ( ...args