Skip to content

Commit 6eff0c9

Browse files
aliezzahnaliezzahn
committed
v0.0.1
1 parent 435f569 commit 6eff0c9

File tree

5 files changed

+135
-131
lines changed

5 files changed

+135
-131
lines changed

‎package.json‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,7 @@
1414
"main": "./dist/index.js",
1515
"module": "./dist/index.mjs",
1616
"types": "./dist/index.d.ts",
17-
"files": [
18-
"dist"
19-
],
17+
"files": ["dist"],
2018
"scripts": {
2119
"build": "rslib build",
2220
"dev": "rslib build --watch",

‎playground/rsbuild.config.ts‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
1-
import { defineConfig } from "@rsbuild/core";
2-
import { pluginCssMinimizer } from "../src";
1+
import { defineConfig } from '@rsbuild/core';
2+
import { pluginCssMinimizer } from '../src';
33

44
export default defineConfig({
55
plugins: [
66
pluginCssMinimizer({
7-
minifier: "lightningcss",
7+
minifier: 'lightningcss',
88
lightningCssOptions: {
99
minimizerOptions: {
10-
targets: ["> 0.25%", "not dead"],
10+
targets: ['> 0.25%', 'not dead'],
1111
drafts: { nesting: true },
1212
},
1313
},

‎rslib.config.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,4 +5,4 @@ export default defineConfig({
55
{ format: 'esm', syntax: 'es2021', dts: true },
66
{ format: 'cjs', syntax: 'es2021' },
77
],
8-
});
8+
});

‎src/index.ts‎

Lines changed: 107 additions & 105 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import type {
2-
ChainIdentifier,
3-
RsbuildPlugin,
4-
Rspack,
5-
RspackChain,
2+
ChainIdentifier,
3+
RsbuildPlugin,
4+
Rspack,
5+
RspackChain,
66
} from '@rsbuild/core';
77
import CssMinimizerWebpackPlugin from 'css-minimizer-webpack-plugin';
88
import type CssMinimizerPlugin from 'css-minimizer-webpack-plugin';
@@ -13,84 +13,84 @@ import { type ConfigChain, reduceConfigs } from 'reduce-configs';
1313
* @see https://cssnano.co/docs/optimisations
1414
*/
1515
export type CssNanoOptions = {
16-
/** Path to a cssnano configuration file. */
17-
configFile?: string | undefined;
18-
/** Preset name and optional configuration object for cssnano. */
19-
preset?: [string, object] | string | undefined;
16+
/** Path to a cssnano configuration file. */
17+
configFile?: string | undefined;
18+
/** Preset name and optional configuration object for cssnano. */
19+
preset?: [string, object] | string | undefined;
2020
};
2121

2222
/**
2323
* Options for Lightning CSS minifier.
2424
* @see https://lightningcss.dev/options.html
2525
*/
2626
export type LightningCssOptions = {
27-
/** Browser targets for minification, using browserslist syntax or specific versions. */
28-
targets?: string | string[] | { [key: string]: number };
29-
/** Enable CSS nesting (draft specification). */
30-
drafts?: { nesting?: boolean };
31-
/** Additional Lightning CSS-specific options. */
32-
[key: string]: any;
27+
/** Browser targets for minification, using browserslist syntax or specific versions. */
28+
targets?: string | string[] | { [key: string]: number };
29+
/** Enable CSS nesting (draft specification). */
30+
drafts?: { nesting?: boolean };
31+
/** Additional Lightning CSS-specific options. */
32+
[key: string]: unknown;
3333
};
3434

3535
/**
3636
* Options for the CSS minimizer plugin.
3737
*/
3838
export type PluginCssMinimizerOptions = {
39-
/**
40-
* Specifies the CSS minifier to use.
41-
* - 'cssnano': Uses cssnano (JavaScript-based) for minification with extensive optimizations.
42-
* - 'lightningcss': Uses Lightning CSS (Rust-based) for faster minification.
43-
* @default 'cssnano'
44-
*/
45-
minifier?: 'cssnano' | 'lightningcss';
46-
/**
47-
* Configuration options for cssnano minifier.
48-
* Only applied if minifier is set to 'cssnano'.
49-
* @example
50-
* {
51-
* preset: ['default', { mergeLonghand: false }]
52-
* }
53-
*/
54-
cssnanoOptions?: ConfigChain<
55-
CssMinimizerPlugin.BasePluginOptions &
56-
CssMinimizerPlugin.DefinedDefaultMinimizerAndOptions<CssNanoOptions>
57-
>;
58-
/**
59-
* Configuration options for Lightning CSS minifier.
60-
* Only applied if minifier is set to 'lightningcss'.
61-
* @example
62-
* {
63-
* targets: ['> 0.25%', 'not dead'],
64-
* drafts: { nesting: true }
65-
* }
66-
*/
67-
lightningCssOptions?: ConfigChain<
68-
CssMinimizerPlugin.BasePluginOptions &
69-
CssMinimizerPlugin.DefinedDefaultMinimizerAndOptions<LightningCssOptions>
70-
>;
39+
/**
40+
* Specifies the CSS minifier to use.
41+
* - 'cssnano': Uses cssnano (JavaScript-based) for minification with extensive optimizations.
42+
* - 'lightningcss': Uses Lightning CSS (Rust-based) for faster minification.
43+
* @default 'cssnano'
44+
*/
45+
minifier?: 'cssnano' | 'lightningcss';
46+
/**
47+
* Configuration options for cssnano minifier.
48+
* Only applied if minifier is set to 'cssnano'.
49+
* @example
50+
* {
51+
* preset: ['default', { mergeLonghand: false }]
52+
* }
53+
*/
54+
cssnanoOptions?: ConfigChain<
55+
CssMinimizerPlugin.BasePluginOptions &
56+
CssMinimizerPlugin.DefinedDefaultMinimizerAndOptions<CssNanoOptions>
57+
>;
58+
/**
59+
* Configuration options for Lightning CSS minifier.
60+
* Only applied if minifier is set to 'lightningcss'.
61+
* @example
62+
* {
63+
* targets: ['> 0.25%', 'not dead'],
64+
* drafts: { nesting: true }
65+
* }
66+
*/
67+
lightningCssOptions?: ConfigChain<
68+
CssMinimizerPlugin.BasePluginOptions &
69+
CssMinimizerPlugin.DefinedDefaultMinimizerAndOptions<LightningCssOptions>
70+
>;
7171
};
7272

7373
/**
7474
* Default options for cssnano minifier.
7575
* @returns Default cssnano configuration.
7676
*/
7777
const getCssnanoDefaultOptions = (): CssNanoOptions => ({
78-
preset: [
79-
'default',
80-
{
81-
// Disable mergeLonghand to avoid breaking safe-area-inset-top
82-
// https://github.com/cssnano/cssnano/issues/803
83-
mergeLonghand: false,
84-
},
85-
],
78+
preset: [
79+
'default',
80+
{
81+
// Disable mergeLonghand to avoid breaking safe-area-inset-top
82+
// https://github.com/cssnano/cssnano/issues/803
83+
mergeLonghand: false,
84+
},
85+
],
8686
});
8787

8888
/**
8989
* Default options for Lightning CSS minifier.
9090
* @returns Default Lightning CSS configuration.
9191
*/
9292
const getLightningCssDefaultOptions = (): LightningCssOptions => ({
93-
targets: 'defaults', // Default browserslist query for modern browsers
93+
targets: 'defaults', // Default browserslist query for modern browsers
9494
});
9595

9696
/**
@@ -100,45 +100,47 @@ const getLightningCssDefaultOptions = (): LightningCssOptions => ({
100100
* @param options - Plugin options including minifier type and specific configurations.
101101
*/
102102
export function applyCSSMinimizer(
103-
chain: RspackChain,
104-
CHAIN_ID: ChainIdentifier,
105-
options: PluginCssMinimizerOptions = {},
103+
chain: RspackChain,
104+
CHAIN_ID: ChainIdentifier,
105+
options: PluginCssMinimizerOptions = {},
106106
): void {
107-
const { minifier = 'cssnano', cssnanoOptions, lightningCssOptions } = options;
107+
const { minifier = 'cssnano', cssnanoOptions, lightningCssOptions } = options;
108108

109-
if (minifier === 'cssnano') {
110-
const mergedOptions: CssMinimizerPlugin.BasePluginOptions &
111-
CssMinimizerPlugin.DefinedDefaultMinimizerAndOptions<CssNanoOptions> = reduceConfigs({
112-
initial: {
113-
minify: CssMinimizerWebpackPlugin.cssnanoMinify,
114-
minimizerOptions: getCssnanoDefaultOptions(),
115-
},
116-
config: cssnanoOptions,
117-
});
109+
if (minifier === 'cssnano') {
110+
const mergedOptions: CssMinimizerPlugin.BasePluginOptions &
111+
CssMinimizerPlugin.DefinedDefaultMinimizerAndOptions<CssNanoOptions> =
112+
reduceConfigs({
113+
initial: {
114+
minify: CssMinimizerWebpackPlugin.cssnanoMinify,
115+
minimizerOptions: getCssnanoDefaultOptions(),
116+
},
117+
config: cssnanoOptions,
118+
});
118119

119-
chain.optimization
120-
.minimizer(CHAIN_ID.MINIMIZER.CSS)
121-
.use(CssMinimizerWebpackPlugin as Rspack.RspackPluginInstance, [
122-
mergedOptions,
123-
])
124-
.end();
125-
} else {
126-
const mergedOptions: CssMinimizerPlugin.BasePluginOptions &
127-
CssMinimizerPlugin.DefinedDefaultMinimizerAndOptions<LightningCssOptions> = reduceConfigs({
128-
initial: {
129-
minify: CssMinimizerWebpackPlugin.lightningCssMinify,
130-
minimizerOptions: getLightningCssDefaultOptions(),
131-
},
132-
config: lightningCssOptions,
133-
});
120+
chain.optimization
121+
.minimizer(CHAIN_ID.MINIMIZER.CSS)
122+
.use(CssMinimizerWebpackPlugin as Rspack.RspackPluginInstance, [
123+
mergedOptions,
124+
])
125+
.end();
126+
} else {
127+
const mergedOptions: CssMinimizerPlugin.BasePluginOptions &
128+
CssMinimizerPlugin.DefinedDefaultMinimizerAndOptions<LightningCssOptions> =
129+
reduceConfigs({
130+
initial: {
131+
minify: CssMinimizerWebpackPlugin.lightningCssMinify,
132+
minimizerOptions: getLightningCssDefaultOptions(),
133+
},
134+
config: lightningCssOptions,
135+
});
134136

135-
chain.optimization
136-
.minimizer(CHAIN_ID.MINIMIZER.CSS)
137-
.use(CssMinimizerWebpackPlugin as Rspack.RspackPluginInstance, [
138-
mergedOptions,
139-
])
140-
.end();
141-
}
137+
chain.optimization
138+
.minimizer(CHAIN_ID.MINIMIZER.CSS)
139+
.use(CssMinimizerWebpackPlugin as Rspack.RspackPluginInstance, [
140+
mergedOptions,
141+
])
142+
.end();
143+
}
142144
}
143145

144146
/**
@@ -171,23 +173,23 @@ export const PLUGIN_CSS_MINIMIZER_NAME = 'rsbuild:css-minimizer';
171173
* })
172174
*/
173175
export const pluginCssMinimizer = (
174-
options?: PluginCssMinimizerOptions,
176+
options?: PluginCssMinimizerOptions,
175177
): RsbuildPlugin => ({
176-
name: PLUGIN_CSS_MINIMIZER_NAME,
178+
name: PLUGIN_CSS_MINIMIZER_NAME,
177179

178-
setup(api) {
179-
api.modifyBundlerChain(async (chain, { CHAIN_ID, environment, isProd }) => {
180-
const { config } = environment;
181-
const { minify } = config.output;
180+
setup(api) {
181+
api.modifyBundlerChain(async (chain, { CHAIN_ID, environment, isProd }) => {
182+
const { config } = environment;
183+
const { minify } = config.output;
182184

183-
if (
184-
isProd &&
185-
(minify === true || (typeof minify === 'object' && minify.css))
186-
) {
187-
applyCSSMinimizer(chain, CHAIN_ID, options);
188-
}
189-
});
190-
},
185+
if (
186+
isProd &&
187+
(minify === true || (typeof minify === 'object' && minify.css))
188+
) {
189+
applyCSSMinimizer(chain, CHAIN_ID, options);
190+
}
191+
});
192+
},
191193
});
192194

193-
export { CssMinimizerWebpackPlugin };
195+
export { CssMinimizerWebpackPlugin };

‎test/basic/index.test.ts‎

Lines changed: 22 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -11,15 +11,17 @@ test('should render page as expected', async ({ page }) => {
1111
const rsbuild = await createRsbuild({
1212
cwd: __dirname,
1313
rsbuildConfig: {
14-
plugins: [pluginCssMinimizer({
15-
minifier: 'lightningcss',
16-
lightningCssOptions: {
17-
minimizerOptions: {
18-
targets: ['> 0.25%', 'not dead'],
19-
drafts: { nesting: true },
20-
},
21-
},
22-
}),],
14+
plugins: [
15+
pluginCssMinimizer({
16+
minifier: 'lightningcss',
17+
lightningCssOptions: {
18+
minimizerOptions: {
19+
targets: ['> 0.25%', 'not dead'],
20+
drafts: { nesting: true },
21+
},
22+
},
23+
}),
24+
],
2325
server: {
2426
port: getRandomPort(),
2527
},
@@ -38,15 +40,17 @@ test('should build succeed', async ({ page }) => {
3840
const rsbuild = await createRsbuild({
3941
cwd: __dirname,
4042
rsbuildConfig: {
41-
plugins: [pluginCssMinimizer({
42-
minifier: 'lightningcss',
43-
lightningCssOptions: {
44-
minimizerOptions: {
45-
targets: ['> 0.25%', 'not dead'],
46-
drafts: { nesting: true },
47-
},
48-
},
49-
}),],
43+
plugins: [
44+
pluginCssMinimizer({
45+
minifier: 'lightningcss',
46+
lightningCssOptions: {
47+
minimizerOptions: {
48+
targets: ['> 0.25%', 'not dead'],
49+
drafts: { nesting: true },
50+
},
51+
},
52+
}),
53+
],
5054
},
5155
});
5256

0 commit comments

Comments
 (0)