import { ApiMeta } from '@components/ApiMeta.tsx';

SwcJsMinimizerRspackPlugin

<ApiMeta specific={['Rspack']} />

This plugin is used to minify JavaScript files using SWC.

Example

Use this plugin via optimization.minimizer:

import { rspack } from '@rspack/core';

export default {
  optimization: {
    minimizer: [
      new rspack.SwcJsMinimizerRspackPlugin({
        // options
      }),
      new rspack.LightningCssMinimizerRspackPlugin(),
    ],
  },
};

:::tip When optimization.minimizer is set, the default minimizers are disabled, so we need to add LightningCssMinimizerRspackPlugin to minify CSS files. :::

Options

test

• Type: string | RegExp | Array<string | RegExp>
• Default: \.[cm]?js(\?.*)?$

Specify the files to be minimized. You can use regular expressions or file path strings, and only the files that match will be minimized.

For example, the build generates /dist/foo.[hash].js and some other JS files, we only minify foo.js:

new rspack.SwcJsMinimizerRspackPlugin({
  test: /dist\/foo\.\w+\.js$/,
});

include

• Type: string | RegExp | Array<string | RegExp>
• Default: undefined

Same as test, specify the files to be minimized.

new rspack.SwcJsMinimizerRspackPlugin({
  include: /dist\/foo\.\w+\.js$/,
});

exclude

• Type: string | RegExp | Array<string | RegExp>
• Default: undefined

Specify the files to be excluded. You can use regular expressions or file path strings, and the files that match will not be minimized.

For example, the build generates /dist/foo.[hash].js and some other JS files, we exclude the minimization of foo.js:

new rspack.SwcJsMinimizerRspackPlugin({
  exclude: /dist\/foo\.\w+\.js$/,
});

extractComments

• Type:

type ExtractCommentsOptions =
  | boolean
  | RegExp
  | {
      condition?: boolean | RegExp | undefined;
      banner?: string | boolean | undefined;
    };

• Default: undefined

Whether comments shall be extracted to a separate file. If the original file is named foo.js, then the comments will be stored to foo.js.LICENSE.txt.

boolean

If value is true, it is equivalent to /@preserve|@lic|@cc_on|^\**!/ regexp condition and remove remaining comments.

new rspack.SwcJsMinimizerRspackPlugin({
  extractComments: {
    condition: /@preserve|@lic|@cc_on|^\**!/,
  },
});

If value is false, all comments will be removed.

new rspack.SwcJsMinimizerRspackPlugin({
  extractComments: false,
});

RegExp

If value is RegExp, all comments that match the given expression will be extracted to the separate file.

new rspack.SwcJsMinimizerRspackPlugin({
  extractComments: /@preserve|@lic|@cc_on|^\**!/,
});

object

If value is object, it can use condition and banner to customize the extraction.

new rspack.SwcJsMinimizerRspackPlugin({
  extractComments: {
    // add comments that match the condition will be extracted
    condition: /@preserve|@lic|@cc_on|^\**!/,
    // add banner to the top of the `*.LICENSE.txt` file
    // If `true`, use the default banner `/*! LICENSE: {relative} */`
    // If `false`, no banner will be added
    // If `string`, use the given banner
    banner: true,
  },
});

minimizerOptions

• Type:

type MinimizerOptions = {
  minify?: boolean;
  module?: boolean;
  ecma?: 5 | 2015 | 2016 | string | number;
  mangle?: TerserMangleOptions | boolean;
  compress?: TerserCompressOptions | boolean;
  format?: JsFormatOptions & ToSnakeCaseProperties<JsFormatOptions>;
};

• Default:

const defaultOptions = {
  minify: true,
  mangle: true,
  ecma: 5, // or derived from Rspack's target configuration
  compress: {
    passes: 2,
  }
  format: {
    comments: false,
  },
};

:::tip Default ecma from Rspack target If ecma is not specified, SwcJsMinimizerRspackPlugin will automatically derive a default value from Rspack's target configuration. Otherwise, it defaults to 5.

This means you can rely on your Rspack target configuration without manually specifying the same ecma version in the plugin options. :::

Similar to the jsc.minify option of SWC, please refer to SWC - Minification for all available options.

For example, disable mangle to avoid mangling variable names:

new rspack.SwcJsMinimizerRspackPlugin({
  minimizerOptions: {
    mangle: false,
  },
});

For example, set a higher passes to run more compression passes. In some cases this may result in a smaller bundle size, but the more passes that are run, the more time it takes to compress.

new rspack.SwcJsMinimizerRspackPlugin({
  minimizerOptions: {
    compress: {
      passes: 4,
    },
  },
});