此插件使用 SWC 来压缩 JavaScript 代码。
通过 optimization.minimizer 使用此插件:
import { rspack } from '@rspack/core';
export default {
// ...
optimization: {
minimizer: [
new rspack.SwcJsMinimizerRspackPlugin({
// options
}),
new rspack.LightningCssMinimizerRspackPlugin(),
],
},
};
当设置了 optimization.minimizer 时,默认的压缩器会被禁用,因此我们需要同时添加 LightningCssMinimizerRspackPlugin 来压缩 CSS 文件。
string | RegExp | Array<string | RegExp>\.[cm]?js(\?.*)?$指定需要被压缩的产物文件。可以使用正则表达式或者文件路径字符串,只有匹配的文件会被压缩。
例如,构建生成了 /dist/foo.[hash].js 和其他 JS 文件,我们仅对 foo.js 进行压缩:
new rspack.SwcJsMinimizerRspackPlugin({
test: /dist\/foo\.\w+\.js$/,
});string | RegExp | Array<string | RegExp>undefined与 test 的作用一致,指定需要被压缩的产物文件。
new rspack.SwcJsMinimizerRspackPlugin({
include: /dist\/foo\.\w+\.js$/,
});string | RegExp | Array<string | RegExp>undefined指定需要被排除的产物文件。可以使用正则表达式或者文件路径字符串,匹配的文件不会被压缩。
例如,构建生成了 /dist/foo.[hash].js 和其他 JS 文件,我们排除 foo.js 的压缩:
new rspack.SwcJsMinimizerRspackPlugin({
exclude: /dist\/foo\.\w+\.js$/,
});type ExtractCommentsOptions =
| boolean
| RegExp
| {
condition?: boolean | RegExp | undefined;
banner?: string | boolean | undefined;
};undefined是否将注释提取到单独的文件中。如果原始文件名是 foo.js,则注释将提取到 foo.js.LICENSE.txt 文件中。
如果值为 true,等同于 /@preserve|@lic|@cc_on|^\**!/ 正则表达式,并移除其他的注释。
new rspack.SwcJsMinimizerRspackPlugin({
extractComments: {
condition: /@preserve|@lic|@cc_on|^\**!/,
},
});如果值为 false,则移除所有注释。
new rspack.SwcJsMinimizerRspackPlugin({
extractComments: false,
});如果值为 RegExp,则将匹配的注释提取到单独的文件中。
new rspack.SwcJsMinimizerRspackPlugin({
extractComments: /@preserve|@lic|@cc_on|^\**!/,
});如果值为 object,则可以使用 condition 和 banner 来自定义注释的提取。
new rspack.SwcJsMinimizerRspackPlugin({
extractComments: {
// 将匹配的注释提取到单独的文件中
condition: /@preserve|@lic|@cc_on|^\**!/,
// 在 `*.LICENSE.txt` 文件顶部的横幅
// 如果为 `true`,则使用默认的横幅 `/*! For license information please see {relative} */`
// 如果为 `false`,则不添加横幅
// 如果为 `string`,则使用给定的横幅
banner: true,
},
});type MinimizerOptions = {
minify?: boolean;
module?: boolean;
ecma?: 5 | 2015 | 2016 | string | number;
mangle?: TerserMangleOptions | boolean;
compress?: TerserCompressOptions | boolean;
format?: JsFormatOptions & ToSnakeCaseProperties<JsFormatOptions>;
};const defaultOptions = {
minify: true,
mangle: true,
ecma: 5,
compress: {
passes: 2,
}
format: {
comments: false,
},
};类似于 SWC 的 jsc.minify 选项,请参考 SWC - Minification 了解所有可用的选项。
例如,关闭 mangle 来避免对变量名进行混淆:
new rspack.SwcJsMinimizerRspackPlugin({
minimizerOptions: {
mangle: false,
},
});例如,设置更高的 passes 来运行更多的压缩次数。在一些情况下,这可能会输出更小的包体积,但执行次数越多,压缩需要的时间就越长。
new rspack.SwcJsMinimizerRspackPlugin({
minimizerOptions: {
compress: {
passes: 4,
},
},
});