Restrict React DOM imports from Server Components (#27382)

Adds a separate entry point for the react-dom package when it's accessed
from a Server Component environment, using the "react-server" export
condition.

When you're inside a Server Component module, you won't be able to
import client-only APIs like useState. This applies to almost all React
DOM exports, except for Float ones like preload.
This commit is contained in:
Andrew Clark
2023-09-15 14:53:19 -04:00
committed by GitHub
parent d6dcad6a8b
commit 2d2f2af29b
6 changed files with 56 additions and 2 deletions
+9
View File
@@ -11,6 +11,7 @@ module.exports = [
shortName: 'dom-node',
entryPoints: [
'react-dom',
'react-dom/src/ReactDOMSharedSubset.js',
'react-dom/unstable_testing',
'react-dom/src/server/react-dom-server.node.js',
'react-dom/static.node',
@@ -21,6 +22,7 @@ module.exports = [
],
paths: [
'react-dom',
'react-dom/src/ReactDOMSharedSubset.js',
'react-dom-bindings',
'react-dom/client',
'react-dom/server',
@@ -73,6 +75,7 @@ module.exports = [
],
paths: [
'react-dom',
'react-dom/src/ReactDOMSharedSubset.js',
'react-dom-bindings',
'react-dom/client',
'react-dom/server.browser',
@@ -101,6 +104,7 @@ module.exports = [
entryPoints: ['react-server-dom-esm/client.browser'],
paths: [
'react-dom',
'react-dom/src/ReactDOMSharedSubset.js',
'react-dom/client',
'react-dom/server',
'react-dom/server.node',
@@ -128,6 +132,7 @@ module.exports = [
],
paths: [
'react-dom',
'react-dom/src/ReactDOMSharedSubset.js',
'react-dom-bindings',
'react-dom/client',
'react-dom/server.edge',
@@ -158,6 +163,7 @@ module.exports = [
],
paths: [
'react-dom',
'react-dom/src/ReactDOMSharedSubset.js',
'react-dom-bindings',
'react-dom/client',
'react-dom/server',
@@ -192,6 +198,7 @@ module.exports = [
],
paths: [
'react-dom',
'react-dom/src/ReactDOMSharedSubset.js',
'react-dom-bindings',
'react-dom/client',
'react-dom/server',
@@ -224,6 +231,7 @@ module.exports = [
],
paths: [
'react-dom',
'react-dom/src/ReactDOMSharedSubset.js',
'react-dom-bindings',
'react-server-dom-webpack',
'react-dom/src/server/ReactDOMLegacyServerImpl.js', // not an entrypoint, but only usable in *Brower and *Node files
@@ -241,6 +249,7 @@ module.exports = [
entryPoints: ['react-server-dom-fb/src/ReactDOMServerFB.js'],
paths: [
'react-dom',
'react-dom/src/ReactDOMSharedSubset.js',
'react-dom-bindings',
'react-server-dom-fb',
'shared/ReactDOMSharedInternals',