Skip to content

Commit e72ed00

Browse files
committed
fix(rsc-mf): share react-server-dom-rspack client runtime
1 parent c8dd159 commit e72ed00

2 files changed

Lines changed: 199 additions & 8 deletions

File tree

tests/integration/rsc-mf/host/module-federation.config.ts

Lines changed: 103 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,115 @@
1+
import path from 'path';
12
import { createModuleFederationConfig } from '@module-federation/modern-js-v3';
23

34
const REMOTE_PORT = process.env.RSC_MF_REMOTE_PORT || '3008';
5+
const LAYERS = {
6+
ssr: 'server-side-rendering',
7+
rsc: 'react-server-components',
8+
} as const;
9+
const reactServerImport = path.join(
10+
path.dirname(require.resolve('react/package.json')),
11+
'react.react-server.js',
12+
);
13+
const reactDomServerImport = path.join(
14+
path.dirname(require.resolve('react-dom/package.json')),
15+
'react-dom.react-server.js',
16+
);
17+
const reactServerDomClientImport = 'react-server-dom-rspack/client.browser';
18+
19+
const sharedByScope = [
20+
{
21+
react: {
22+
singleton: true,
23+
requiredVersion: false,
24+
shareScope: 'default',
25+
},
26+
'react-dom': {
27+
singleton: true,
28+
requiredVersion: false,
29+
shareScope: 'default',
30+
},
31+
'react-server-dom-rspack': {
32+
singleton: true,
33+
requiredVersion: false,
34+
shareScope: 'default',
35+
},
36+
'react-server-dom-rspack/client.browser': {
37+
import: reactServerDomClientImport,
38+
shareKey: reactServerDomClientImport,
39+
singleton: true,
40+
requiredVersion: false,
41+
shareScope: 'default',
42+
},
43+
},
44+
{
45+
react: {
46+
import: 'react',
47+
shareKey: 'react',
48+
singleton: true,
49+
requiredVersion: false,
50+
shareScope: 'ssr',
51+
layer: LAYERS.ssr,
52+
issuerLayer: LAYERS.ssr,
53+
},
54+
'react-dom': {
55+
import: 'react-dom',
56+
shareKey: 'react-dom',
57+
singleton: true,
58+
requiredVersion: false,
59+
shareScope: 'ssr',
60+
layer: LAYERS.ssr,
61+
issuerLayer: LAYERS.ssr,
62+
},
63+
'react-server-dom-rspack/client.browser': {
64+
import: reactServerDomClientImport,
65+
shareKey: reactServerDomClientImport,
66+
singleton: true,
67+
requiredVersion: false,
68+
shareScope: 'ssr',
69+
layer: LAYERS.ssr,
70+
issuerLayer: LAYERS.ssr,
71+
},
72+
},
73+
{
74+
react: {
75+
import: reactServerImport,
76+
shareKey: 'react',
77+
singleton: true,
78+
requiredVersion: false,
79+
shareScope: 'rsc',
80+
layer: LAYERS.rsc,
81+
issuerLayer: LAYERS.rsc,
82+
},
83+
'react-dom': {
84+
import: reactDomServerImport,
85+
shareKey: 'react-dom',
86+
singleton: true,
87+
requiredVersion: false,
88+
shareScope: 'rsc',
89+
layer: LAYERS.rsc,
90+
issuerLayer: LAYERS.rsc,
91+
},
92+
'react-server-dom-rspack/client.browser': {
93+
import: reactServerDomClientImport,
94+
shareKey: reactServerDomClientImport,
95+
singleton: true,
96+
requiredVersion: false,
97+
shareScope: 'rsc',
98+
layer: LAYERS.rsc,
99+
issuerLayer: LAYERS.rsc,
100+
},
101+
},
102+
];
4103

5104
export default createModuleFederationConfig({
6105
name: 'rscHost',
7106
remotes: {
8107
rscRemote: `rscRemote@http://127.0.0.1:${REMOTE_PORT}/static/mf-manifest.json`,
9108
},
10-
shared: {
11-
react: { singleton: true },
12-
'react-dom': { singleton: true },
13-
},
109+
shared: sharedByScope as any,
110+
runtimePlugins: [
111+
path.resolve(__dirname, './runtime/forceRemotePublicPath.ts'),
112+
],
14113
dts: false,
15114
experiments: {
16115
asyncStartup: true,

tests/integration/rsc-mf/remote/module-federation.config.ts

Lines changed: 96 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,104 @@
1+
import path from 'path';
12
import { createModuleFederationConfig } from '@module-federation/modern-js-v3';
23

34
const LAYERS = {
45
ssr: 'server-side-rendering',
56
rsc: 'react-server-components',
67
} as const;
8+
const reactServerImport = path.join(
9+
path.dirname(require.resolve('react/package.json')),
10+
'react.react-server.js',
11+
);
12+
const reactDomServerImport = path.join(
13+
path.dirname(require.resolve('react-dom/package.json')),
14+
'react-dom.react-server.js',
15+
);
16+
const reactServerDomClientImport = 'react-server-dom-rspack/client.browser';
17+
18+
const sharedByScope = [
19+
{
20+
react: {
21+
singleton: true,
22+
requiredVersion: false,
23+
shareScope: 'default',
24+
},
25+
'react-dom': {
26+
singleton: true,
27+
requiredVersion: false,
28+
shareScope: 'default',
29+
},
30+
'react-server-dom-rspack': {
31+
singleton: true,
32+
requiredVersion: false,
33+
shareScope: 'default',
34+
},
35+
'react-server-dom-rspack/client.browser': {
36+
import: reactServerDomClientImport,
37+
shareKey: reactServerDomClientImport,
38+
singleton: true,
39+
requiredVersion: false,
40+
shareScope: 'default',
41+
},
42+
},
43+
{
44+
react: {
45+
import: 'react',
46+
shareKey: 'react',
47+
singleton: true,
48+
requiredVersion: false,
49+
shareScope: 'ssr',
50+
layer: LAYERS.ssr,
51+
issuerLayer: LAYERS.ssr,
52+
},
53+
'react-dom': {
54+
import: 'react-dom',
55+
shareKey: 'react-dom',
56+
singleton: true,
57+
requiredVersion: false,
58+
shareScope: 'ssr',
59+
layer: LAYERS.ssr,
60+
issuerLayer: LAYERS.ssr,
61+
},
62+
'react-server-dom-rspack/client.browser': {
63+
import: reactServerDomClientImport,
64+
shareKey: reactServerDomClientImport,
65+
singleton: true,
66+
requiredVersion: false,
67+
shareScope: 'ssr',
68+
layer: LAYERS.ssr,
69+
issuerLayer: LAYERS.ssr,
70+
},
71+
},
72+
{
73+
react: {
74+
import: reactServerImport,
75+
shareKey: 'react',
76+
singleton: true,
77+
requiredVersion: false,
78+
shareScope: 'rsc',
79+
layer: LAYERS.rsc,
80+
issuerLayer: LAYERS.rsc,
81+
},
82+
'react-dom': {
83+
import: reactDomServerImport,
84+
shareKey: 'react-dom',
85+
singleton: true,
86+
requiredVersion: false,
87+
shareScope: 'rsc',
88+
layer: LAYERS.rsc,
89+
issuerLayer: LAYERS.rsc,
90+
},
91+
'react-server-dom-rspack/client.browser': {
92+
import: reactServerDomClientImport,
93+
shareKey: reactServerDomClientImport,
94+
singleton: true,
95+
requiredVersion: false,
96+
shareScope: 'rsc',
97+
layer: LAYERS.rsc,
98+
issuerLayer: LAYERS.rsc,
99+
},
100+
},
101+
];
7102

8103
export default createModuleFederationConfig({
9104
name: 'rscRemote',
@@ -61,10 +156,7 @@ export default createModuleFederationConfig({
61156
layer: LAYERS.rsc,
62157
} as any,
63158
},
64-
shared: {
65-
react: { singleton: true },
66-
'react-dom': { singleton: true },
67-
},
159+
shared: sharedByScope as any,
68160
dts: false,
69161
experiments: {
70162
asyncStartup: true,

0 commit comments

Comments
 (0)