Skip to content

Commit 45e155f

Browse files
Coly010Coly010
authored
feat(angular-rspack,angular-rsbuild): add chunking options (#31)
* feat(angular-rspack,angular-rsbuild): add namedChunks option * feat(angular-rspack,angular-rsbuild): add commonChunk and vendorChunk option
1 parent 5ae264e commit 45e155f

File tree

6 files changed

+136
-78
lines changed

6 files changed

+136
-78
lines changed

‎e2e/fixtures/rspack-csr-css/rspack.config.js

+2
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@ module.exports = () => {
3333
options: {
3434
extractLicenses: false,
3535
optimization: false,
36+
namedChunks: true,
37+
vendorChunk: true,
3638
},
3739
},
3840
}

‎packages/angular-rsbuild/src/lib/models/normalize-options.ts

+16
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,18 @@ export function validateOptimization(
7373
);
7474
}
7575

76+
function validateChunkOptions(options: Partial<PluginAngularOptions>) {
77+
if (options.namedChunks !== undefined) {
78+
console.warn(`The "namedChunks" option is not supported with Rsbuild.`);
79+
}
80+
if (options.commonChunk !== undefined) {
81+
console.warn(`The "commonChunk" option is not supported with Rsbuild.`);
82+
}
83+
if (options.vendorChunk !== undefined) {
84+
console.warn(`The "vendorChunk" option is not supported with Rsbuild.`);
85+
}
86+
}
87+
7688
export const DEFAULT_PLUGIN_ANGULAR_OPTIONS: PluginAngularOptions = {
7789
index: './src/index.html',
7890
browser: './src/main.ts',
@@ -92,6 +104,7 @@ export const DEFAULT_PLUGIN_ANGULAR_OPTIONS: PluginAngularOptions = {
92104
outputHashing: 'all',
93105
sourceMap: false,
94106
useTsProjectReferences: false,
107+
namedChunks: false,
95108
skipTypeChecking: false,
96109
devServer: {
97110
port: 4200,
@@ -127,6 +140,8 @@ export function normalizeOptions(
127140
const aot = options.aot ?? true;
128141
const advancedOptimizations = aot && normalizedOptimization;
129142

143+
validateChunkOptions(options);
144+
130145
return {
131146
...DEFAULT_PLUGIN_ANGULAR_OPTIONS,
132147
...restOptions,
@@ -138,6 +153,7 @@ export function normalizeOptions(
138153
advancedOptimizations,
139154
aot,
140155
outputHashing: options.outputHashing ?? 'all',
156+
namedChunks: options.namedChunks ?? false,
141157
fileReplacements: resolveFileReplacements(fileReplacements, root),
142158
hasServer: getHasServer({ server, ssr: normalizedSsr }),
143159
devServer: normalizeDevServer(devServer),

‎packages/angular-rsbuild/src/lib/models/plugin-options.ts

+3
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,9 @@ export interface PluginAngularOptions {
6565
hasServer: boolean;
6666
skipTypeChecking: boolean;
6767
useTsProjectReferences?: boolean;
68+
namedChunks?: boolean;
69+
commonChunk?: boolean;
70+
vendorChunk?: boolean;
6871
stylePreprocessorOptions?: StylePreprocessorOptions;
6972
devServer?: DevServerOptions;
7073
}

‎packages/angular-rspack/src/lib/config/create-config.ts

+106-78
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,8 @@ function configureSourceMap(sourceMap: SourceMap) {
7777
return { sourceMapRules, sourceMapPlugins };
7878
}
7979

80+
const VENDORS_TEST = /[\\/]node_modules[\\/]/;
81+
8082
export async function _createConfig(
8183
options: AngularRspackPluginOptions,
8284
rspackConfigOverrides?: Partial<Configuration>
@@ -231,48 +233,61 @@ export async function _createConfig(
231233
normalizedOptions.devServer?.proxyConfig
232234
),
233235
},
234-
optimization: normalizedOptions.optimization
235-
? {
236-
minimize: true,
237-
runtimeChunk: false,
238-
splitChunks: {
239-
chunks: 'async',
240-
minChunks: 1,
241-
minSize: 20000,
242-
maxAsyncRequests: 30,
243-
maxInitialRequests: 30,
244-
cacheGroups: {
245-
defaultVendors: {
246-
test: /[\\/]node_modules[\\/]/,
247-
priority: -10,
248-
reuseExistingChunk: true,
249-
},
250-
default: {
251-
minChunks: 2,
252-
priority: -20,
253-
reuseExistingChunk: true,
254-
},
255-
},
256-
},
257-
minimizer: [
258-
new SwcJsMinimizerRspackPlugin({
259-
minimizerOptions: {
260-
minify: true,
261-
mangle: true,
262-
compress: {
263-
passes: 2,
236+
optimization: {
237+
chunkIds: normalizedOptions.namedChunks ? 'named' : 'deterministic',
238+
moduleIds: 'deterministic',
239+
...(normalizedOptions.optimization
240+
? {
241+
minimize: true,
242+
runtimeChunk: 'single',
243+
splitChunks: {
244+
chunks: 'async',
245+
minChunks: 1,
246+
minSize: 20000,
247+
maxAsyncRequests: 30,
248+
maxInitialRequests: 30,
249+
cacheGroups: {
250+
default: normalizedOptions.commonChunk && {
251+
chunks: 'async',
252+
minChunks: 2,
253+
priority: 10,
264254
},
265-
format: {
266-
comments: false,
255+
common: normalizedOptions.commonChunk && {
256+
name: 'common',
257+
chunks: 'async',
258+
minChunks: 2,
259+
enforce: true,
260+
priority: 5,
261+
},
262+
vendors: false,
263+
defaultVendors: normalizedOptions.vendorChunk && {
264+
name: 'vendor',
265+
chunks: (chunk) => chunk.name === 'main',
266+
enforce: true,
267+
test: VENDORS_TEST,
267268
},
268269
},
269-
}),
270-
],
271-
}
272-
: {
273-
minimize: false,
274-
minimizer: [],
275-
},
270+
},
271+
minimizer: [
272+
new SwcJsMinimizerRspackPlugin({
273+
minimizerOptions: {
274+
minify: true,
275+
mangle: true,
276+
compress: {
277+
passes: 2,
278+
},
279+
format: {
280+
comments: false,
281+
},
282+
},
283+
}),
284+
],
285+
}
286+
: {
287+
minimize: false,
288+
minimizer: [],
289+
}),
290+
},
276291
plugins: [
277292
...(defaultConfig.plugins ?? []),
278293
new NgRspackPlugin({
@@ -362,48 +377,61 @@ export async function _createConfig(
362377
scriptType: 'module',
363378
module: true,
364379
},
365-
optimization: normalizedOptions.optimization
366-
? {
367-
minimize: true,
368-
runtimeChunk: 'single',
369-
splitChunks: {
370-
chunks: 'all',
371-
minChunks: 1,
372-
minSize: 20000,
373-
maxAsyncRequests: 30,
374-
maxInitialRequests: 30,
375-
cacheGroups: {
376-
defaultVendors: {
377-
test: /[\\/]node_modules[\\/]/,
378-
priority: -10,
379-
reuseExistingChunk: true,
380-
},
381-
default: {
382-
minChunks: 2,
383-
priority: -20,
384-
reuseExistingChunk: true,
385-
},
386-
},
387-
},
388-
minimizer: [
389-
new SwcJsMinimizerRspackPlugin({
390-
minimizerOptions: {
391-
minify: true,
392-
mangle: true,
393-
compress: {
394-
passes: 2,
380+
optimization: {
381+
chunkIds: normalizedOptions.namedChunks ? 'named' : 'deterministic',
382+
moduleIds: 'deterministic',
383+
...(normalizedOptions.optimization
384+
? {
385+
minimize: true,
386+
runtimeChunk: false,
387+
splitChunks: {
388+
chunks: 'all',
389+
minChunks: 1,
390+
minSize: 20000,
391+
maxAsyncRequests: 30,
392+
maxInitialRequests: 30,
393+
cacheGroups: {
394+
default: normalizedOptions.commonChunk && {
395+
chunks: 'async',
396+
minChunks: 2,
397+
priority: 10,
395398
},
396-
format: {
397-
comments: false,
399+
common: normalizedOptions.commonChunk && {
400+
name: 'common',
401+
chunks: 'async',
402+
minChunks: 2,
403+
enforce: true,
404+
priority: 5,
405+
},
406+
vendors: false,
407+
defaultVendors: normalizedOptions.vendorChunk && {
408+
name: 'vendor',
409+
chunks: (chunk) => chunk.name === 'main',
410+
enforce: true,
411+
test: VENDORS_TEST,
398412
},
399413
},
400-
}),
401-
],
402-
}
403-
: {
404-
minimize: false,
405-
minimizer: [],
406-
},
414+
},
415+
minimizer: [
416+
new SwcJsMinimizerRspackPlugin({
417+
minimizerOptions: {
418+
minify: true,
419+
mangle: true,
420+
compress: {
421+
passes: 2,
422+
},
423+
format: {
424+
comments: false,
425+
},
426+
},
427+
}),
428+
],
429+
}
430+
: {
431+
minimize: false,
432+
minimizer: [],
433+
}),
434+
},
407435
plugins: [
408436
...(defaultConfig.plugins ?? []),
409437
new NgRspackPlugin({

‎packages/angular-rspack/src/lib/models/angular-rspack-plugin-options.ts

+6
Original file line numberDiff line numberDiff line change
@@ -104,6 +104,9 @@ export interface AngularRspackPluginOptions {
104104
optimization?: boolean | OptimizationOptions;
105105
outputHashing?: OutputHashing;
106106
stylePreprocessorOptions?: StylePreprocessorOptions;
107+
namedChunks?: boolean;
108+
vendorChunk?: boolean;
109+
commonChunk?: boolean;
107110
devServer?: DevServerOptions;
108111
extractLicenses?: boolean;
109112
}
@@ -115,6 +118,9 @@ export interface NormalizedAngularRspackPluginOptions
115118
index: NormalizedIndexElement | undefined;
116119
devServer: DevServerOptions & { port: number };
117120
extractLicenses: boolean;
121+
namedChunks: boolean;
122+
vendorChunk: boolean;
123+
commonChunk: boolean;
118124
globalScripts: GlobalEntry[];
119125
globalStyles: GlobalEntry[];
120126
optimization: boolean | OptimizationOptions;

‎packages/angular-rspack/src/lib/models/normalize-options.ts

+3
Original file line numberDiff line numberDiff line change
@@ -223,6 +223,9 @@ export function normalizeOptions(
223223
hasServer: getHasServer({ server, ssr: normalizedSsr }),
224224
skipTypeChecking: options.skipTypeChecking ?? false,
225225
useTsProjectReferences: options.useTsProjectReferences ?? false,
226+
namedChunks: options.namedChunks ?? false,
227+
vendorChunk: options.vendorChunk ?? false,
228+
commonChunk: options.commonChunk ?? true,
226229
devServer: normalizeDevServer(options.devServer),
227230
extractLicenses: options.extractLicenses ?? true,
228231
};

0 commit comments

Comments
 (0)