Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Create a bunch of custom webpack vs unbundled node bundles #26172

Merged
merged 5 commits into from
Feb 16, 2023
+257 −33
Merged

Create a bunch of custom webpack vs unbundled node bundles #26172

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
fb8192f
Split client into separate builds per environment including unbundled…
sebmarkbage Feb 16, 2023
7c1658f
Split out into separate webpack environment builds
sebmarkbage Feb 16, 2023
d308d58
Detect the browser entry in the plugin
sebmarkbage Feb 16, 2023
1d6fc52
Fix Bun types. Bun doesn't have a Flight build yet.
sebmarkbage Feb 16, 2023
ccd959b
Merge branch 'main' into webpacknodebuilds
gaearon Feb 16, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion fixtures/flight-browser/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ <h1>Flight Example</h1>
<script src="../../build/node_modules/react-dom/umd/react-dom.development.js"></script>
<script src="../../build/node_modules/react-dom/umd/react-dom-server.browser.development.js"></script>
<script src="../../build/node_modules/react-server-dom-webpack/umd/react-server-dom-webpack-server.browser.development.js"></script>
<script src="../../build/node_modules/react-server-dom-webpack/umd/react-server-dom-webpack-client.development.js"></script>
<script src="../../build/node_modules/react-server-dom-webpack/umd/react-server-dom-webpack-client.browser.development.js"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.js"></script>
<script type="text/babel">
let Suspense = React.Suspense;
Expand Down
0 ...s/ReactFlightClientHostConfig.dom-edge.js → ...lightClientHostConfig.dom-edge-webpack.js
View file
Open in desktop
File renamed without changes.
12 changes: 12 additions & 0 deletions packages/react-client/src/forks/ReactFlightClientHostConfig.dom-node-webpack.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
*/

export * from 'react-client/src/ReactFlightClientHostConfigBrowser';
export * from 'react-client/src/ReactFlightClientHostConfigStream';
export * from 'react-server-dom-webpack/src/ReactFlightClientWebpackBundlerConfig';
0 ...rc/forks/ReactFiberHostConfig.dom-edge.js → .../ReactFiberHostConfig.dom-edge-webpack.js
View file
Open in desktop
File renamed without changes.
10 changes: 10 additions & 0 deletions packages/react-reconciler/src/forks/ReactFiberHostConfig.dom-node-webpack.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
*/

export * from 'react-dom-bindings/src/client/ReactDOMHostConfig';
10 changes: 10 additions & 0 deletions packages/react-server-dom-webpack/client.browser.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
*/

export * from './src/ReactFlightDOMClient';
10 changes: 10 additions & 0 deletions packages/react-server-dom-webpack/client.edge.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
*/

export * from './src/ReactFlightDOMClient';
2 changes: 1 addition & 1 deletion packages/react-server-dom-webpack/client.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,4 +7,4 @@
* @flow
*/

export * from './src/ReactFlightDOMClient';
export * from './client.browser';
10 changes: 10 additions & 0 deletions packages/react-server-dom-webpack/client.node.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
*/

export * from './src/ReactFlightDOMClient';
10 changes: 10 additions & 0 deletions packages/react-server-dom-webpack/client.node.unbundled.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
*/

export * from './src/ReactFlightDOMClient';
7 changes: 7 additions & 0 deletions packages/react-server-dom-webpack/npm/client.browser.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
'use strict';

if (process.env.NODE_ENV === 'production') {
module.exports = require('./cjs/react-server-dom-webpack-client.browser.production.min.js');
} else {
module.exports = require('./cjs/react-server-dom-webpack-client.browser.development.js');
}
7 changes: 7 additions & 0 deletions packages/react-server-dom-webpack/npm/client.edge.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
'use strict';

if (process.env.NODE_ENV === 'production') {
module.exports = require('./cjs/react-server-dom-webpack-client.edge.production.min.js');
} else {
module.exports = require('./cjs/react-server-dom-webpack-client.edge.development.js');
}
6 changes: 1 addition & 5 deletions packages/react-server-dom-webpack/npm/client.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,3 @@
'use strict';

if (process.env.NODE_ENV === 'production') {
module.exports = require('./cjs/react-server-dom-webpack-client.production.min.js');
} else {
module.exports = require('./cjs/react-server-dom-webpack-client.development.js');
}
module.exports = require('./client.browser');
7 changes: 7 additions & 0 deletions packages/react-server-dom-webpack/npm/client.node.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
'use strict';

if (process.env.NODE_ENV === 'production') {
module.exports = require('./cjs/react-server-dom-webpack-client.node.production.min.js');
} else {
module.exports = require('./cjs/react-server-dom-webpack-client.node.development.js');
}
7 changes: 7 additions & 0 deletions packages/react-server-dom-webpack/npm/client.node.unbundled.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
'use strict';

if (process.env.NODE_ENV === 'production') {
module.exports = require('./cjs/react-server-dom-webpack-client.node.unbundled.production.min.js');
} else {
module.exports = require('./cjs/react-server-dom-webpack-client.node.unbundled.development.js');
}
7 changes: 7 additions & 0 deletions packages/react-server-dom-webpack/npm/server.node.unbundled.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
'use strict';

if (process.env.NODE_ENV === 'production') {
module.exports = require('./cjs/react-server-dom-webpack-server.node.unbundled.production.min.js');
} else {
module.exports = require('./cjs/react-server-dom-webpack-server.node.unbundled.development.js');
}
30 changes: 27 additions & 3 deletions packages/react-server-dom-webpack/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,15 @@
"index.js",
"plugin.js",
"client.js",
"client.browser.js",
"client.edge.js",
"client.node.js",
"client.node.unbundled.js",
"server.js",
"server.browser.js",
"server.edge.js",
"server.node.js",
"server.node.unbundled.js",
"node-register.js",
"cjs/",
"umd/",
Expand All @@ -26,20 +31,39 @@
"exports": {
".": "./index.js",
"./plugin": "./plugin.js",
"./client": "./client.js",
"./client": {
"workerd": "./client.edge.js",
"edge-light": "./client.edge.js",
"deno": "./client.edge.js",
"worker": "./client.edge.js",
"node": {
"webpack": "./client.node.js",
"default": "./client.node.unbundled.js"
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These forks are the key and shows that Node can be used in two ways.

},
"browser": "./client.browser.js",
"default": "./client.browser.js"
},
"./client.browser": "./client.browser.js",
"./client.edge": "./client.edge.js",
"./client.node": "./client.node.js",
"./client.node.unbundled": "./client.node.unbundled.js",
"./server": {
"react-server": {
"edge-light": "./server.edge.js",
"workerd": "./server.edge.js",
"edge-light": "./server.edge.js",
"deno": "./server.browser.js",
"node": "./server.node.js",
"node": {
"webpack": "./server.node.js",
"default": "./server.node.unbundled.js"
},
"browser": "./server.browser.js"
},
"default": "./server.js"
},
"./server.browser": "./server.browser.js",
"./server.edge": "./server.edge.js",
"./server.node": "./server.node.js",
"./server.node.unbundled": "./server.node.unbundled.js",
"./node-loader": "./esm/react-server-dom-webpack-node-loader.js",
"./node-register": "./node-register.js",
"./src/*": "./src/*",
Expand Down
10 changes: 10 additions & 0 deletions packages/react-server-dom-webpack/server.node.unbundled.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
*/

export * from './src/ReactFlightDOMServerNode';
2 changes: 1 addition & 1 deletion packages/react-server-dom-webpack/src/__tests__/ReactFlightDOM-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ describe('ReactFlightDOM', () => {
use = React.use;
Suspense = React.Suspense;
ReactDOMClient = require('react-dom/client');
ReactServerDOMWriter = require('react-server-dom-webpack/server.node');
ReactServerDOMWriter = require('react-server-dom-webpack/server.node.unbundled');
ReactServerDOMReader = require('react-server-dom-webpack/client');

ErrorBoundary = class extends React.Component {
Expand Down
0 ...forks/ReactFlightServerConfig.dom-edge.js → ...actFlightServerConfig.dom-edge-webpack.js
View file
Open in desktop
File renamed without changes.
11 changes: 11 additions & 0 deletions packages/react-server/src/forks/ReactFlightServerConfig.dom-node-webpack.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
*/

export * from '../ReactFlightServerConfigStream';
export * from 'react-server-dom-webpack/src/ReactFlightServerWebpackBundlerConfig';
0 ...forks/ReactServerFormatConfig.dom-edge.js → ...actServerFormatConfig.dom-edge-webpack.js
View file
Open in desktop
File renamed without changes.
10 changes: 10 additions & 0 deletions packages/react-server/src/forks/ReactServerFormatConfig.dom-node-webpack.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
*/

export * from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig';
0 ...forks/ReactServerStreamConfig.dom-edge.js → ...actServerStreamConfig.dom-edge-webpack.js
View file
Open in desktop
File renamed without changes.
10 changes: 10 additions & 0 deletions packages/react-server/src/forks/ReactServerStreamConfig.dom-node-webpack.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
*/

export * from '../ReactServerStreamConfigNode';
38 changes: 37 additions & 1 deletion scripts/rollup/bundles.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -357,6 +357,15 @@ const bundles = [
wrapWithModuleBoundaries: false,
externals: ['react', 'util', 'async_hooks', 'react-dom'],
},
{
bundleTypes: [NODE_DEV, NODE_PROD],
moduleType: RENDERER,
entry: 'react-server-dom-webpack/server.node.unbundled',
global: 'ReactServerDOMServer',
minifyWithProdErrorCodes: false,
wrapWithModuleBoundaries: false,
externals: ['react', 'util', 'async_hooks', 'react-dom'],
},
{
bundleTypes: [NODE_DEV, NODE_PROD],
moduleType: RENDERER,
Expand All @@ -371,7 +380,34 @@ const bundles = [
{
bundleTypes: [NODE_DEV, NODE_PROD, UMD_DEV, UMD_PROD],
moduleType: RENDERER,
entry: 'react-server-dom-webpack/client',
entry: 'react-server-dom-webpack/client.browser',
global: 'ReactServerDOMClient',
minifyWithProdErrorCodes: false,
wrapWithModuleBoundaries: false,
externals: ['react'],
},
{
bundleTypes: [NODE_DEV, NODE_PROD],
moduleType: RENDERER,
entry: 'react-server-dom-webpack/client.node',
global: 'ReactServerDOMClient',
minifyWithProdErrorCodes: false,
wrapWithModuleBoundaries: false,
externals: ['react'],
},
{
bundleTypes: [NODE_DEV, NODE_PROD],
moduleType: RENDERER,
entry: 'react-server-dom-webpack/client.node.unbundled',
global: 'ReactServerDOMClient',
minifyWithProdErrorCodes: false,
wrapWithModuleBoundaries: false,
externals: ['react'],
},
{
bundleTypes: [NODE_DEV, NODE_PROD],
moduleType: RENDERER,
entry: 'react-server-dom-webpack/client.edge',
global: 'ReactServerDOMClient',
minifyWithProdErrorCodes: false,
wrapWithModuleBoundaries: false,
Expand Down
Loading