@samitouri / QOS-React / commits / 8c234c0de9

Move the Webpack manifest config to one level deeper (#26083)

This frees up the Webpack manifest to contain a `serverManifest` part too. @shuding

Sebastian Markbåge committed Jan 31, 2023 at 23:33 UTC 8c234c0de9be40dcb95f33fcefb57aed845d324b
7 files changed +22 -19
fixtures/flight/server/handler.server.js
+3 -4
@@ -20,10 +20,9 @@ module.exports = function (req, res) {
20 const App = m.default.default || m.default;
21 res.setHeader('Access-Control-Allow-Origin', '*');
22 const moduleMap = JSON.parse(data);
23 - const {pipe} = renderToPipeableStream(
24 - React.createElement(App),
25 - moduleMap
26 - );
23 + const {pipe} = renderToPipeableStream(React.createElement(App), {
24 + clientManifest: moduleMap,
25 + });
26 pipe(res);
27 }
28 );
packages/react-server-dom-webpack/src/ReactFlightDOMServerBrowser.js
+2 -2
@@ -27,12 +27,12 @@ type Options = {
27
28 function renderToReadableStream(
29 model: ReactModel,
30 - webpackMap: BundlerConfig,
30 + webpackMaps: BundlerConfig,
31 options?: Options,
32 ): ReadableStream {
33 const request = createRequest(
34 model,
35 - webpackMap,
35 + webpackMaps,
36 options ? options.onError : undefined,
37 options ? options.context : undefined,
38 options ? options.identifierPrefix : undefined,
packages/react-server-dom-webpack/src/ReactFlightDOMServerNode.js
+2 -2
@@ -37,12 +37,12 @@ type PipeableStream = {
37
38 function renderToPipeableStream(
39 model: ReactModel,
40 - webpackMap: BundlerConfig,
40 + webpackMaps: BundlerConfig,
41 options?: Options,
42 ): PipeableStream {
43 const request = createRequest(
44 model,
45 - webpackMap,
45 + webpackMaps,
46 options ? options.onError : undefined,
47 options ? options.context : undefined,
48 options ? options.identifierPrefix : undefined,
packages/react-server-dom-webpack/src/ReactFlightServerWebpackBundlerConfig.js
+4 -2
@@ -13,7 +13,9 @@ type WebpackMap = {
13 },
14 };
15
16 -export type BundlerConfig = WebpackMap;
16 +export type BundlerConfig = {
17 + clientManifest: WebpackMap,
18 +};
19
20 // eslint-disable-next-line no-unused-vars
21 export type ClientReference<T> = {
@@ -54,7 +56,7 @@ export function resolveModuleMetaData<T>(
56 clientReference: ClientReference<T>,
57 ): ModuleMetaData {
58 const resolvedModuleData =
57 - config[clientReference.filepath][clientReference.name];
59 + config.clientManifest[clientReference.filepath][clientReference.name];
60 if (clientReference.async) {
61 return {
62 id: resolvedModuleData.id,
packages/react-server-dom-webpack/src/__tests__/ReactFlightDOM-test.js
+2 -2
@@ -848,8 +848,8 @@ describe('ReactFlightDOM', () => {
848 });
849
850 // We simulate a bug in the Webpack bundler which causes an error on the server.
851 - for (const id in webpackMap) {
852 - Object.defineProperty(webpackMap, id, {
851 + for (const id in webpackMap.clientManifest) {
852 + Object.defineProperty(webpackMap.clientManifest, id, {
853 get: () => {
854 throw new Error('bug in the bundler');
855 },
packages/react-server-dom-webpack/src/__tests__/ReactFlightDOMBrowser-test.js
+4 -2
@@ -473,12 +473,14 @@ describe('ReactFlightDOMBrowser', () => {
473 const ClientComponentOnTheServer = clientExports(ClientComponent);
474
475 // In the SSR bundle this module won't exist. We simulate this by deleting it.
476 - const clientId = webpackMap[ClientComponentOnTheClient.filepath]['*'].id;
476 + const clientId =
477 + webpackMap.clientManifest[ClientComponentOnTheClient.filepath]['*'].id;
478 delete webpackModules[clientId];
479
480 // Instead, we have to provide a translation from the client meta data to the SSR
481 // meta data.
481 - const ssrMetaData = webpackMap[ClientComponentOnTheServer.filepath]['*'];
482 + const ssrMetaData =
483 + webpackMap.clientManifest[ClientComponentOnTheServer.filepath]['*'];
484 const translationMap = {
485 [clientId]: {
486 '*': ssrMetaData,
packages/react-server-dom-webpack/src/__tests__/utils/WebpackMock.js
+5 -5
@@ -13,7 +13,7 @@ const Module = require('module');
13 let webpackModuleIdx = 0;
14 const webpackModules = {};
15 const webpackErroredModules = {};
16 -const webpackMap = {};
16 +const webpackMap = {clientManifest: {}};
17 global.__webpack_require__ = function (id) {
18 if (webpackErroredModules[id]) {
19 throw webpackErroredModules[id];
@@ -44,7 +44,7 @@ exports.clientModuleError = function clientModuleError(moduleError) {
44 const idx = '' + webpackModuleIdx++;
45 webpackErroredModules[idx] = moduleError;
46 const path = url.pathToFileURL(idx).href;
47 - webpackMap[path] = {
47 + webpackMap.clientManifest[path] = {
48 '': {
49 id: idx,
50 chunks: [],
@@ -65,7 +65,7 @@ exports.clientExports = function clientExports(moduleExports) {
65 const idx = '' + webpackModuleIdx++;
66 webpackModules[idx] = moduleExports;
67 const path = url.pathToFileURL(idx).href;
68 - webpackMap[path] = {
68 + webpackMap.clientManifest[path] = {
69 '': {
70 id: idx,
71 chunks: [],
@@ -81,7 +81,7 @@ exports.clientExports = function clientExports(moduleExports) {
81 moduleExports.then(
82 asyncModuleExports => {
83 for (const name in asyncModuleExports) {
84 - webpackMap[path][name] = {
84 + webpackMap.clientManifest[path][name] = {
85 id: idx,
86 chunks: [],
87 name: name,
@@ -92,7 +92,7 @@ exports.clientExports = function clientExports(moduleExports) {
92 );
93 }
94 for (const name in moduleExports) {
95 - webpackMap[path][name] = {
95 + webpackMap.clientManifest[path][name] = {
96 id: idx,
97 chunks: [],
98 name: name,