From 911451d6a45e11b52f57594c535a537f97012e5c Mon Sep 17 00:00:00 2001 From: eps1lon Date: Fri, 30 Aug 2024 18:36:52 +0200 Subject: [PATCH] Use server.browser for now No plans to support React 19 in Pages router. --- examples/reproduction-template/package.json | 4 ++-- packages/create-next-app/templates/index.ts | 2 +- packages/next/package.json | 4 ++-- .../shims/ReactDOMServerEdgeIfAvailable.d.ts | 1 - .../shims/ReactDOMServerEdgeIfAvailable.js | 18 ------------------ packages/next/src/build/webpack-config.ts | 4 ++-- packages/next/src/server/render.tsx | 7 ++++--- packages/next/types/react-dom.d.ts | 4 ++++ test/.stats-app/package.json | 4 ++-- .../next-test/first-time-setup-js/package.json | 4 ++-- .../next-test/first-time-setup-ts/package.json | 4 ++-- 11 files changed, 21 insertions(+), 35 deletions(-) delete mode 100644 packages/next/src/build/shims/ReactDOMServerEdgeIfAvailable.d.ts delete mode 100644 packages/next/src/build/shims/ReactDOMServerEdgeIfAvailable.js diff --git a/examples/reproduction-template/package.json b/examples/reproduction-template/package.json index e46540ae538d7..c8f51d82ac2fb 100644 --- a/examples/reproduction-template/package.json +++ b/examples/reproduction-template/package.json @@ -7,8 +7,8 @@ }, "dependencies": { "next": "canary", - "react": "19.0.0-rc-7771d3a7-20240827", - "react-dom": "19.0.0-rc-7771d3a7-20240827" + "react": "^18.2.0", + "react-dom": "^18.2.0" }, "devDependencies": { "@types/node": "20.12.12", diff --git a/packages/create-next-app/templates/index.ts b/packages/create-next-app/templates/index.ts index ffbcd544c9b58..706277ed487f5 100644 --- a/packages/create-next-app/templates/index.ts +++ b/packages/create-next-app/templates/index.ts @@ -13,7 +13,7 @@ import { GetTemplateFileArgs, InstallTemplateArgs } from "./types"; // Do not rename or format. sync-react script relies on this line. // prettier-ignore -const nextjsReactPeerVersion = "19.0.0-rc-7771d3a7-20240827"; +const nextjsReactPeerVersion = "^18.2.0"; /** * Get the file path for a given file in a template, e.g. "next.config.js". diff --git a/packages/next/package.json b/packages/next/package.json index fc6f03d4623da..24d0a08c0005f 100644 --- a/packages/next/package.json +++ b/packages/next/package.json @@ -108,8 +108,8 @@ "@opentelemetry/api": "^1.1.0", "@playwright/test": "^1.41.2", "babel-plugin-react-compiler": "*", - "react": "^18.2.0 || 19.0.0-rc-7771d3a7-20240827", - "react-dom": "^18.2.0 || 19.0.0-rc-7771d3a7-20240827", + "react": "^18.2.0", + "react-dom": "^18.2.0", "sass": "^1.3.0" }, "peerDependenciesMeta": { diff --git a/packages/next/src/build/shims/ReactDOMServerEdgeIfAvailable.d.ts b/packages/next/src/build/shims/ReactDOMServerEdgeIfAvailable.d.ts deleted file mode 100644 index 4d4f000bdf487..0000000000000 --- a/packages/next/src/build/shims/ReactDOMServerEdgeIfAvailable.d.ts +++ /dev/null @@ -1 +0,0 @@ -export * from 'react-dom/server.edge' diff --git a/packages/next/src/build/shims/ReactDOMServerEdgeIfAvailable.js b/packages/next/src/build/shims/ReactDOMServerEdgeIfAvailable.js deleted file mode 100644 index cbe329c9e4cb3..0000000000000 --- a/packages/next/src/build/shims/ReactDOMServerEdgeIfAvailable.js +++ /dev/null @@ -1,18 +0,0 @@ -let ReactDOMServer - -try { - ReactDOMServer = require('react-dom/server.edge') -} catch (error) { - if ( - // TODO: copilot suggestion. Does this code actually exist? - error.code !== 'MODULE_NOT_FOUND' && - // TODO: actually encountered that - error.code !== 'ERR_PACKAGE_PATH_NOT_EXPORTED' - ) { - throw error - } - // TOOD: Ensure App Router does not bundle this - ReactDOMServer = require('react-dom/server.browser') -} - -module.exports = ReactDOMServer diff --git a/packages/next/src/build/webpack-config.ts b/packages/next/src/build/webpack-config.ts index 5c932f7f05122..619ed00bb69e2 100644 --- a/packages/next/src/build/webpack-config.ts +++ b/packages/next/src/build/webpack-config.ts @@ -108,8 +108,8 @@ const NEXT_PROJECT_ROOT_DIST_CLIENT = path.join( 'client' ) -if (parseInt(React.version) < 18) { - throw new Error('Next.js requires react >= 18.2.0 to be installed.') +if (parseInt(React.version) !== 18) { + throw new Error('Next.js requires react@^18.2.0 to be installed.') } export const babelIncludeRegexes: RegExp[] = [ diff --git a/packages/next/src/server/render.tsx b/packages/next/src/server/render.tsx index ce6c46cd61cdc..cd6bc2db0324e 100644 --- a/packages/next/src/server/render.tsx +++ b/packages/next/src/server/render.tsx @@ -40,7 +40,7 @@ import type { Revalidate, SwrDelta } from './lib/revalidate' import type { COMPILER_NAMES } from '../shared/lib/constants' import React, { type JSX } from 'react' -import ReactDOMServerEdge from '../build/shims/ReactDOMServerEdgeIfAvailable' +import ReactDOMServerBrowser from 'react-dom/server.browser' import { StyleRegistry, createStyleRegistry } from 'styled-jsx' import { GSP_NO_RETURNED_VALUE, @@ -127,7 +127,8 @@ function noRouter() { } async function renderToString(element: React.ReactElement) { - const renderStream = await ReactDOMServerEdge.renderToReadableStream(element) + const renderStream = + await ReactDOMServerBrowser.renderToReadableStream(element) await renderStream.allReady return streamToString(renderStream) } @@ -1322,7 +1323,7 @@ export async function renderToHTMLImpl( ) => { const content = renderContent(EnhancedApp, EnhancedComponent) return await renderToInitialFizzStream({ - ReactDOMServer: ReactDOMServerEdge, + ReactDOMServer: ReactDOMServerBrowser, element: content, }) } diff --git a/packages/next/types/react-dom.d.ts b/packages/next/types/react-dom.d.ts index 9b811922e4d55..7c11484f3bb36 100644 --- a/packages/next/types/react-dom.d.ts +++ b/packages/next/types/react-dom.d.ts @@ -70,6 +70,10 @@ declare module 'react-dom/server.edge' { > } +declare module 'react-dom/server.browser' { + export * from 'react-dom/server.edge' +} + declare module 'react-dom/static.edge' { import type { JSX } from 'react' /** diff --git a/test/.stats-app/package.json b/test/.stats-app/package.json index 58cf2ed6c29fd..992116f073459 100644 --- a/test/.stats-app/package.json +++ b/test/.stats-app/package.json @@ -4,8 +4,8 @@ "license": "MIT", "dependencies": { "next": "latest", - "react": "19.0.0-rc-7771d3a7-20240827", - "react-dom": "19.0.0-rc-7771d3a7-20240827" + "react": "^18.2.0", + "react-dom": "^18.2.0" }, "engines": { "node": ">=18.18.0" diff --git a/test/e2e/next-test/first-time-setup-js/package.json b/test/e2e/next-test/first-time-setup-js/package.json index a135b40a27c11..8e949d122db4b 100644 --- a/test/e2e/next-test/first-time-setup-js/package.json +++ b/test/e2e/next-test/first-time-setup-js/package.json @@ -8,7 +8,7 @@ }, "dependencies": { "next": "canary", - "react": "19.0.0-rc-7771d3a7-20240827", - "react-dom": "19.0.0-rc-7771d3a7-20240827" + "react": "^18.2.0", + "react-dom": "^18.2.0" } } diff --git a/test/e2e/next-test/first-time-setup-ts/package.json b/test/e2e/next-test/first-time-setup-ts/package.json index 107dfe0c5b5f7..d85d37ff59ee1 100644 --- a/test/e2e/next-test/first-time-setup-ts/package.json +++ b/test/e2e/next-test/first-time-setup-ts/package.json @@ -8,8 +8,8 @@ }, "dependencies": { "next": "canary", - "react": "19.0.0-rc-7771d3a7-20240827", - "react-dom": "19.0.0-rc-7771d3a7-20240827" + "react": "^18.2.0", + "react-dom": "^18.2.0" }, "devDependencies": { "@types/react": "^18",