@opennextjs/cloudflare 0.3.4 → 0.3.5

package/dist/cli/build/index.js

@@ -42,6 +42,7 @@ export async function build(projectOpts) {
     buildHelper.checkRunningInsideNextjsApp(options);
     logger.info(`App directory: ${options.appPath}`);
     buildHelper.printNextjsVersion(options);
+    ensureNextjsVersionSupported(options);
     buildHelper.printOpenNextVersion(options);
     if (projectOpts.skipNextBuild) {
         logger.warn("Skipping Next.js build");
@@ -209,3 +210,9 @@ export async function getLatestCompatDate() {
         /* empty */
     }
 }
+function ensureNextjsVersionSupported(options) {
+    if (buildHelper.compareSemver(options.nextVersion, "14.0.0") < 0) {
+        logger.error("Next.js version unsupported, please upgrade to version 14 or greater.");
+        process.exit(1);
+    }
+}

package/dist/cli/build/patches/to-investigate/patch-exception-bubbling.js

@@ -5,5 +5,13 @@
  * promises.
  */
 export function patchExceptionBubbling(code) {
-    return code.replace('_nextBubbleNoFallback = "1"', "_nextBubbleNoFallback = undefined");
+    // The code before had: `query._nextBubbleNoFallback = '1'`, that has ben refactored to
+    // `addRequestMeta(req, 'bubbleNoFallback', true)` in https://github.com/vercel/next.js/pull/74100
+    // we need to support both for backward compatibility, that's why we have the following if statement
+    if (code.includes("_nextBubbleNoFallback")) {
+        return code.replace('_nextBubbleNoFallback = "1"', "_nextBubbleNoFallback = undefined");
+    }
+    // The Next.js transpiled code contains something like `(0, _requestmeta.addRequestMeta)(req, "bubbleNoFallback", true);`
+    // and we want to update it to `(0, _requestmeta.addRequestMeta)(req, "bubbleNoFallback", false);`
+    return code.replace(/\((.*?.addRequestMeta\)\(.*?,\s+"bubbleNoFallback"),\s+true\)/, "($1, false)");
 }

package/dist/cli/build/patches/to-investigate/wrangler-deps.js

@@ -1,5 +1,7 @@
 import { readFileSync, statSync, writeFileSync } from "node:fs";
 import { join } from "node:path";
+import * as ts from "ts-morph";
+import { tsParseFile } from "../../utils/index.js";
 export function patchWranglerDeps(config) {
     console.log("# patchWranglerDeps");
     const distPath = getDistPath(config);
@@ -13,6 +15,7 @@ export function patchWranglerDeps(config) {
     const pagesRuntimeFile = join(distPath, "compiled", "next-server", "pages.runtime.prod.js");
     const patchedPagesRuntime = readFileSync(pagesRuntimeFile, "utf-8").replace(`e.exports=require("critters")`, `e.exports={}`);
     writeFileSync(pagesRuntimeFile, patchedPagesRuntime);
+    patchRequireReactDomServerEdge(config);
     // Patch .next/standalone/node_modules/next/dist/server/lib/trace/tracer.js
     //
     // Remove the need for an alias in wrangler.toml:
@@ -52,3 +55,92 @@ function getDistPath(config) {
     }
     throw new Error("Unexpected error: unable to detect the node_modules/next/dist directory");
 }
+/**
+ * `react-dom` v>=19 has a `server.edge` export: https://github.com/facebook/react/blob/a160102f3/packages/react-dom/package.json#L79
+ * but version of `react-dom` <= 18 do not have this export but have a `server.browser` export instead: https://github.com/facebook/react/blob/8a015b68/packages/react-dom/package.json#L49
+ *
+ * Next.js also try-catches importing the `server.edge` export:
+ *  https://github.com/vercel/next.js/blob/6784575/packages/next/src/server/ReactDOMServerPages.js
+ *
+ * The issue here is that in the `.next/standalone/node_modules/next/dist/compiled/next-server/pages.runtime.prod.js`
+ * file for whatever reason there is a non `try-catch`ed require for the `server.edge` export
+ *
+ * This functions fixes this issue by wrapping the require in a try-catch block in the same way Next.js does it
+ * (note: this will make the build succeed but doesn't guarantee that everything will necessarily work at runtime since
+ * it's not clear what code and how might be rely on this require call)
+ *
+ */
+function patchRequireReactDomServerEdge(config) {
+    const distPath = getDistPath(config);
+    // Patch .next/standalone/node_modules/next/dist/compiled/next-server/pages.runtime.prod.js
+    const pagesRuntimeFile = join(distPath, "compiled", "next-server", "pages.runtime.prod.js");
+    const code = readFileSync(pagesRuntimeFile, "utf-8");
+    const file = tsParseFile(code);
+    // we need to update this function: `e=>{"use strict";e.exports=require("react-dom/server.edge")}`
+    file.getDescendantsOfKind(ts.SyntaxKind.ArrowFunction).forEach((arrowFunction) => {
+        // the function has a single parameter
+        const p = arrowFunction.getParameters();
+        if (p.length !== 1) {
+            return;
+        }
+        const parameterName = p[0].getName();
+        const bodyChildren = arrowFunction.getBody().getChildren();
+        if (!(bodyChildren.length === 3 &&
+            bodyChildren[0].getFullText() === "{" &&
+            bodyChildren[2].getFullText() === "}")) {
+            return;
+        }
+        const bodyStatements = bodyChildren[1]?.getChildren();
+        // the function has only two statements: "use strict" and e.exports=require("react-dom/server.edge")
+        if (!(bodyStatements?.length === 2 &&
+            bodyStatements.every((statement) => statement.isKind(ts.SyntaxKind.ExpressionStatement)))) {
+            return;
+        }
+        const bodyExpressionStatements = bodyStatements;
+        const stringLiteralExpression = bodyExpressionStatements[0].getExpressionIfKind(ts.SyntaxKind.StringLiteral);
+        // the first statement needs to be "use strict"
+        if (stringLiteralExpression?.getText() !== '"use strict"') {
+            return;
+        }
+        // the second statement (e.exports=require("react-dom/server.edge")) needs to be a binary expression
+        const binaryExpression = bodyExpressionStatements[1].getExpressionIfKind(ts.SyntaxKind.BinaryExpression);
+        if (!binaryExpression?.getOperatorToken().isKind(ts.SyntaxKind.EqualsToken)) {
+            return;
+        }
+        // on the left we have `${parameterName}.exports`
+        const binaryLeft = binaryExpression.getLeft();
+        if (!binaryLeft.isKind(ts.SyntaxKind.PropertyAccessExpression) ||
+            binaryLeft.getExpressionIfKind(ts.SyntaxKind.Identifier)?.getText() !== parameterName ||
+            binaryLeft.getName() !== "exports") {
+            return;
+        }
+        // on the right we have `require("react-dom/server.edge")`
+        const binaryRight = binaryExpression.getRight();
+        if (!binaryRight.isKind(ts.SyntaxKind.CallExpression) ||
+            binaryRight.getExpressionIfKind(ts.SyntaxKind.Identifier)?.getText() !== "require") {
+            return;
+        }
+        const requireArgs = binaryRight.getArguments();
+        if (requireArgs.length !== 1 || requireArgs[0].getText() !== '"react-dom/server.edge"') {
+            return;
+        }
+        arrowFunction.setBodyText(`
+      "use strict";
+      let ReactDOMServer;
+      try {
+          ReactDOMServer = require('react-dom/server.edge');
+      } catch (error) {
+          if (
+          error.code !== 'MODULE_NOT_FOUND' &&
+          error.code !== 'ERR_PACKAGE_PATH_NOT_EXPORTED'
+          ) {
+          throw error;
+          }
+          ReactDOMServer = require('react-dom/server.browser');
+      }
+      ${parameterName}.exports = ReactDOMServer;
+      }`.replace(/\ns*/g, " "));
+    });
+    const updatedCode = file.print();
+    writeFileSync(pagesRuntimeFile, updatedCode);
+}

package/dist/cli/templates/worker.js

@@ -45,9 +45,6 @@ export default {
  * Note that cloudflare env string values are copied by the middleware handler.
  */
 async function populateProcessEnv(url, nextJsEnv) {
-    if (process.env.__PROCESS_ENV_POPULATED === "1") {
-        return;
-    }
     // @ts-expect-error: resolved by wrangler build
     const nextEnvVars = await import("./.env.mjs");
     const mode = nextJsEnv ?? "production";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@opennextjs/cloudflare",
   "description": "Cloudflare builder for next apps",
-  "version": "0.3.4",
+  "version": "0.3.5",
   "type": "module",
   "bin": {
     "opennextjs-cloudflare": "dist/cli/index.js"