diff --git a/.changeset/twelve-dancers-learn.md b/.changeset/twelve-dancers-learn.md new file mode 100644 index 0000000000..240b5af2da --- /dev/null +++ b/.changeset/twelve-dancers-learn.md @@ -0,0 +1,5 @@ +--- +"@lynx-js/react-rsbuild-plugin": patch +--- + +Change `extractStr` to `false` when `performance.chunkSplit.strategy` is not `all-in-one`. diff --git a/packages/rspeedy/plugin-react/src/entry.ts b/packages/rspeedy/plugin-react/src/entry.ts index e74a5705c2..05c0928747 100644 --- a/packages/rspeedy/plugin-react/src/entry.ts +++ b/packages/rspeedy/plugin-react/src/entry.ts @@ -54,12 +54,12 @@ export function applyEntry( pipelineSchedulerConfig, removeDescendantSelectorScope, targetSdkVersion, - extractStr, + extractStr: originalExtractStr, experimental_isLazyBundle, } = options - const { config } = api.useExposed( + const { config, logger } = api.useExposed( Symbol.for('rspeedy.api'), )! api.modifyBundlerChain((chain, { environment, isDev, isProd }) => { @@ -240,6 +240,17 @@ export function applyEntry( const rsbuildConfig = api.getRsbuildConfig() + let extractStr = originalExtractStr + if ( + rsbuildConfig.performance?.chunkSplit?.strategy !== 'all-in-one' + && originalExtractStr + ) { + logger.warn( + '`extractStr` is changed to `false` because it is only supported in `all-in-one` chunkSplit strategy, please set `performance.chunkSplit.strategy` to `all-in-one` to use `extractStr.`', + ) + extractStr = false + } + chain .plugin(PLUGIN_NAME_REACT) .after(PLUGIN_NAME_TEMPLATE) diff --git a/packages/rspeedy/plugin-react/test/config.test.ts b/packages/rspeedy/plugin-react/test/config.test.ts index 5f2863440f..4b10d9cf68 100644 --- a/packages/rspeedy/plugin-react/test/config.test.ts +++ b/packages/rspeedy/plugin-react/test/config.test.ts @@ -1434,6 +1434,91 @@ describe('Config', () => { `) }) + test('performance.chunkSplit.strategy: "split-by-experience" along with extractStr: true', async () => { + const { pluginReactLynx } = await import('../src/pluginReactLynx.js') + + let config, ReactLynxWebpackPlugin + + let rsbuild = await createRsbuild({ + rsbuildConfig: { + plugins: [ + pluginReactLynx({ + extractStr: true, + }), + pluginStubRspeedyAPI(), + ], + performance: { + chunkSplit: { + strategy: 'split-by-experience', + }, + }, + }, + }) + ;[config] = await rsbuild.initConfigs() + + ReactLynxWebpackPlugin = config?.plugins?.find(( + p, + ): p is ReactWebpackPlugin => + p?.constructor.name === 'ReactWebpackPlugin' + ) + + // @ts-expect-error private field + // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access + expect(ReactLynxWebpackPlugin?.options.extractStr).toBe(false) + // expect(config).toMatchInlineSnapshot() + + rsbuild = await createRsbuild({ + rsbuildConfig: { + plugins: [ + pluginReactLynx({ + extractStr: true, + }), + pluginStubRspeedyAPI(), + ], + }, + }) + ;[config] = await rsbuild.initConfigs() + + ReactLynxWebpackPlugin = config?.plugins?.find(( + p, + ): p is ReactWebpackPlugin => + p?.constructor.name === 'ReactWebpackPlugin' + ) + + // @ts-expect-error private field + // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access + expect(ReactLynxWebpackPlugin?.options.extractStr).toBe(true) + // expect(config).toMatchInlineSnapshot() + + rsbuild = await createRsbuild({ + rsbuildConfig: { + plugins: [ + pluginReactLynx({ + extractStr: true, + }), + pluginStubRspeedyAPI(), + ], + performance: { + chunkSplit: { + strategy: 'all-in-one', + }, + }, + }, + }) + ;[config] = await rsbuild.initConfigs() + + ReactLynxWebpackPlugin = config?.plugins?.find(( + p, + ): p is ReactWebpackPlugin => + p?.constructor.name === 'ReactWebpackPlugin' + ) + + // @ts-expect-error private field + // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access + expect(ReactLynxWebpackPlugin?.options.extractStr).toBe(true) + // expect(config).toMatchInlineSnapshot() + }) + test('tools.rspack.optimization.splitChunks: false', async () => { const { pluginReactLynx } = await import('../src/pluginReactLynx.js')