From ffb2cfd3e5956ee3788b98837af78819cf6926ae Mon Sep 17 00:00:00 2001 From: conico974 Date: Tue, 18 Jul 2023 00:47:55 +0200 Subject: [PATCH] fix: missing react/jsx-runtime for require-hooks (#159) * fix: missing react/jsx-runtime for require-hooks * Server: fix missing react/jsx-runtime for require-hooks --------- Co-authored-by: Frank --- .changeset/moody-ways-knock.md | 5 + .../open-next/src/adapters/require-hooks.ts | 194 ++++++------------ 2 files changed, 63 insertions(+), 136 deletions(-) create mode 100644 .changeset/moody-ways-knock.md diff --git a/.changeset/moody-ways-knock.md b/.changeset/moody-ways-knock.md new file mode 100644 index 00000000..0afd0dc0 --- /dev/null +++ b/.changeset/moody-ways-knock.md @@ -0,0 +1,5 @@ +--- +"open-next": patch +--- + +Server: fix missing react/jsx-runtime for require-hooks diff --git a/packages/open-next/src/adapters/require-hooks.ts b/packages/open-next/src/adapters/require-hooks.ts index 48d16e10..1f6fcb11 100644 --- a/packages/open-next/src/adapters/require-hooks.ts +++ b/packages/open-next/src/adapters/require-hooks.ts @@ -33,6 +33,53 @@ function addHookAliases( } } +const baseOverrides = { + react: "next/dist/compiled/react", + "react/package.json": "next/dist/compiled/react/package.json", + "react/jsx-runtime": "next/dist/compiled/react/jsx-runtime", + "react/jsx-dev-runtime": "next/dist/compiled/react/jsx-dev-runtime", + "react-dom": "next/dist/compiled/react-dom/server-rendering-stub", + "react-dom/package.json": "next/dist/compiled/react-dom/package.json", + "react-dom/client": "next/dist/compiled/react-dom/client", + "react-dom/server": "next/dist/compiled/react-dom/server", + "react-dom/server.browser": "next/dist/compiled/react-dom/server.browser", + "react-dom/server.edge": "next/dist/compiled/react-dom/server.edge", + "react-server-dom-webpack/client": + "next/dist/compiled/react-server-dom-webpack/client", + "react-server-dom-webpack/client.edge": + "next/dist/compiled/react-server-dom-webpack/client.edge", + "react-server-dom-webpack/server.edge": + "next/dist/compiled/react-server-dom-webpack/server.edge", + "react-server-dom-webpack/server.node": + "next/dist/compiled/react-server-dom-webpack/server.node", +}; + +const experimentalOverrides = { + react: "next/dist/compiled/react-experimental", + "react/jsx-runtime": "next/dist/compiled/react-experimental/jsx-runtime", + "react/jsx-dev-runtime": + "next/dist/compiled/react-experimental/jsx-dev-runtime", + "react-dom": + "next/dist/compiled/react-dom-experimental/server-rendering-stub", + "react/package.json": "next/dist/compiled/react-experimental/package.json", + "react-dom/package.json": + "next/dist/compiled/react-dom-experimental/package.json", + "react-dom/client": "next/dist/compiled/react-dom-experimental/client", + "react-dom/server": "next/dist/compiled/react-dom-experimental/server", + "react-dom/server.browser": + "next/dist/compiled/react-dom-experimental/server.browser", + "react-dom/server.edge": + "next/dist/compiled/react-dom-experimental/server.edge", + "react-server-dom-webpack/client": + "next/dist/compiled/react-server-dom-webpack-experimental/client", + "react-server-dom-webpack/client.edge": + "next/dist/compiled/react-server-dom-webpack-experimental/client.edge", + "react-server-dom-webpack/server.edge": + "next/dist/compiled/react-server-dom-webpack-experimental/server.edge", + "react-server-dom-webpack/server.node": + "next/dist/compiled/react-server-dom-webpack-experimental/server.node", +}; + // Add default aliases function overrideDefault() { addHookAliases( @@ -41,24 +88,25 @@ function overrideDefault() { // styled-jsx needs to be resolved as the external dependency. ["styled-jsx", require.resolve("styled-jsx")], ["styled-jsx/style", require.resolve("styled-jsx/style")], - ["styled-jsx/style", require.resolve("styled-jsx/style")], ], "app" ); } +const toResolveMap = (map: Record): [string, string][] => + Object.entries(map).map(([key, value]) => [key, require.resolve(value)]); + // Override built-in React packages if necessary function overrideReact(config: NextConfig) { - addHookAliases( - [ - ["react", require.resolve(`react`)], - ["react/jsx-runtime", require.resolve(`react/jsx-runtime`)], - ], - "page" - ); + addHookAliases([["react", require.resolve(`react`)]], "page"); // ignore: react/jsx-dev-runtime is not available on older version of Next.js ie. v13.1.6 + // react/jsx-runtime is not available on newer version of Next.js ie. v13.4.10-canary.3 try { + addHookAliases( + [["react/jsx-runtime", require.resolve(`react/jsx-runtime`)]], + "page" + ); addHookAliases( [["react/jsx-dev-runtime", require.resolve(`react/jsx-dev-runtime`)]], "page" @@ -67,135 +115,9 @@ function overrideReact(config: NextConfig) { if (config.experimental.appDir) { if (config.experimental.serverActions) { - addHookAliases( - [ - ["react", require.resolve(`next/dist/compiled/react-experimental`)], - [ - "react/jsx-runtime", - require.resolve( - `next/dist/compiled/react-experimental/jsx-runtime` - ), - ], - [ - "react/jsx-dev-runtime", - require.resolve( - `next/dist/compiled/react-experimental/jsx-dev-runtime` - ), - ], - [ - "react-dom", - require.resolve( - `next/dist/compiled/react-dom-experimental/server-rendering-stub` - ), - ], - [ - "react-dom/client", - require.resolve(`next/dist/compiled/react-dom-experimental/client`), - ], - [ - "react-dom/server", - require.resolve(`next/dist/compiled/react-dom-experimental/server`), - ], - [ - "react-dom/server.browser", - require.resolve( - `next/dist/compiled/react-dom-experimental/server.browser` - ), - ], - [ - "react-dom/server.edge", - require.resolve( - `next/dist/compiled/react-dom-experimental/server.edge` - ), - ], - [ - "react-server-dom-webpack/client", - require.resolve( - `next/dist/compiled/react-server-dom-webpack-experimental/client` - ), - ], - [ - "react-server-dom-webpack/client.edge", - require.resolve( - `next/dist/compiled/react-server-dom-webpack-experimental/client.edge` - ), - ], - [ - "react-server-dom-webpack/server.edge", - require.resolve( - `next/dist/compiled/react-server-dom-webpack-experimental/server.edge` - ), - ], - [ - "react-server-dom-webpack/server.node", - require.resolve( - `next/dist/compiled/react-server-dom-webpack-experimental/server.node` - ), - ], - ], - "app" - ); + addHookAliases(toResolveMap(experimentalOverrides), "app"); } else { - addHookAliases( - [ - ["react", require.resolve(`next/dist/compiled/react`)], - [ - "react/jsx-runtime", - require.resolve(`next/dist/compiled/react/jsx-runtime`), - ], - [ - "react/jsx-dev-runtime", - require.resolve(`next/dist/compiled/react/jsx-dev-runtime`), - ], - [ - "react-dom", - require.resolve( - `next/dist/compiled/react-dom/server-rendering-stub` - ), - ], - [ - "react-dom/client", - require.resolve(`next/dist/compiled/react-dom/client`), - ], - [ - "react-dom/server", - require.resolve(`next/dist/compiled/react-dom/server`), - ], - [ - "react-dom/server.browser", - require.resolve(`next/dist/compiled/react-dom/server.browser`), - ], - [ - "react-dom/server.edge", - require.resolve(`next/dist/compiled/react-dom/server.edge`), - ], - [ - "react-server-dom-webpack/client", - require.resolve( - `next/dist/compiled/react-server-dom-webpack/client` - ), - ], - [ - "react-server-dom-webpack/client.edge", - require.resolve( - `next/dist/compiled/react-server-dom-webpack/client.edge` - ), - ], - [ - "react-server-dom-webpack/server.edge", - require.resolve( - `next/dist/compiled/react-server-dom-webpack/server.edge` - ), - ], - [ - "react-server-dom-webpack/server.node", - require.resolve( - `next/dist/compiled/react-server-dom-webpack/server.node` - ), - ], - ], - "app" - ); + addHookAliases(toResolveMap(baseOverrides), "app"); } } }