diff --git a/package.json b/package.json
index 162cce7f1e6c..0b5117655871 100644
--- a/package.json
+++ b/package.json
@@ -144,9 +144,9 @@
"pretty-ms": "7.0.0",
"random-seed": "0.3.0",
"react": "17.0.2",
- "react-18": "npm:react@18.0.0-rc.0",
+ "react-18": "npm:react@18.0.0-rc.1",
"react-dom": "17.0.2",
- "react-dom-18": "npm:react-dom@18.0.0-rc.0",
+ "react-dom-18": "npm:react-dom@18.0.0-rc.1",
"react-ssr-prepass": "1.0.8",
"relay-compiler": "13.0.2",
"relay-runtime": "13.0.2",
diff --git a/packages/next/build/webpack/loaders/next-flight-server-loader.ts b/packages/next/build/webpack/loaders/next-flight-server-loader.ts
index d66405948626..dc8884da6fc3 100644
--- a/packages/next/build/webpack/loaders/next-flight-server-loader.ts
+++ b/packages/next/build/webpack/loaders/next-flight-server-loader.ts
@@ -69,11 +69,16 @@ async function parseImportsInfo({
transformedSource += JSON.stringify(`${importSource}?__sc_client__`)
imports += `require(${JSON.stringify(importSource)})\n`
} else {
+ // FIXME
+ // case: 'react'
+ // Avoid module resolution error like Cannot find `./?__rsc_server__` in react/package.json
+
+ // cases: 'react/jsx-runtime', 'react/jsx-dev-runtime'
// This is a special case to avoid the Duplicate React error.
// Since we already include React in the SSR runtime,
// here we can't create a new module with the ?__rsc_server__ query.
if (
- ['react/jsx-runtime', 'react/jsx-dev-runtime'].includes(
+ ['react', 'react/jsx-runtime', 'react/jsx-dev-runtime'].includes(
importSource
)
) {
diff --git a/packages/next/client/index.tsx b/packages/next/client/index.tsx
index 6c2de5960162..39174b90bcdb 100644
--- a/packages/next/client/index.tsx
+++ b/packages/next/client/index.tsx
@@ -547,9 +547,10 @@ function renderReactElement(
const reactEl = fn(shouldHydrate ? markHydrateComplete : markRenderComplete)
if (process.env.__NEXT_REACT_ROOT) {
+ const ReactDOMClient = require('react-dom/client')
if (!reactRoot) {
// Unlike with createRoot, you don't need a separate root.render() call here
- reactRoot = (ReactDOM as any).hydrateRoot(domEl, reactEl)
+ reactRoot = (ReactDOMClient as any).hydrateRoot(domEl, reactEl)
// TODO: Remove shouldHydrate variable when React 18 is stable as it can depend on `reactRoot` existing
shouldHydrate = false
} else {
@@ -812,13 +813,11 @@ if (process.env.__NEXT_RSC) {
return (
-
-
-
+
)
}
diff --git a/packages/next/server/render.tsx b/packages/next/server/render.tsx
index f86b9c3a10a3..06e4bec57b7f 100644
--- a/packages/next/server/render.tsx
+++ b/packages/next/server/render.tsx
@@ -395,11 +395,7 @@ function createServerComponentRenderer(
}
const Component = (props: any) => {
- return (
-
-
-
- )
+ return
}
// Although it's not allowed to attach some static methods to Component,
@@ -1353,7 +1349,6 @@ export async function renderToHTML(
))}
>
),
- generateStaticHTML: true,
})
const flushed = await streamToString(flushEffectStream)
@@ -1365,7 +1360,6 @@ export async function renderToHTML(
element: content,
suffix,
dataStream: serverComponentsInlinedTransformStream?.readable,
- generateStaticHTML: generateStaticHTML || !hasConcurrentFeatures,
flushEffectHandler,
})
}
@@ -1498,7 +1492,6 @@ export async function renderToHTML(
const documentStream = await renderToStream({
ReactDOMServer,
element: document,
- generateStaticHTML: true,
})
documentHTML = await streamToString(documentStream)
} else {
@@ -1753,23 +1746,21 @@ function renderToStream({
element,
suffix,
dataStream,
- generateStaticHTML,
flushEffectHandler,
}: {
ReactDOMServer: typeof import('react-dom/server')
element: React.ReactElement
suffix?: string
dataStream?: ReadableStream
- generateStaticHTML: boolean
flushEffectHandler?: () => Promise
}): Promise> {
- return new Promise((resolve, reject) => {
+ return new Promise(async (resolve, reject) => {
let resolved = false
const closeTag = '