next-on-pages icon indicating copy to clipboard operation
next-on-pages copied to clipboard

[🐛 Bug]: not-found component doesn't work with edge runtime

Open DeJayDev opened this issue 1 year ago • 4 comments

next-on-pages environment related information

System:
        Platform: linux
        Arch: x64
        Version: #1 SMP Fri Mar 29 23:14:13 UTC 2024
        CPU: (16) x64 Intel(R) Core(TM) i9-9900K CPU @ 3.60GHz
        Memory: 16 GB
        Shell: /bin/bash
Package Manager Used: npm (10.8.1)

Relevant Packages:
        @cloudflare/next-on-pages: 1.12.0
        vercel: N/A
        next: 14.2.4

Description

This is a follow up to #413. I've replicated the following Next on Pages error as requested: (@dario-piotrowicz)

⚡️ ERROR: Failed to produce a Cloudflare Pages build from the project.
⚡️
⚡️ 	The following routes were not configured to run with the Edge Runtime:
⚡️ 	  - /_error
⚡️
⚡️ 	Please make sure that all your non-static routes export the following edge runtime route segment config:
⚡️ 	  export const runtime = 'edge';
⚡️
⚡️ 	You can read more about the Edge Runtime on the Next.js documentation:
⚡️ 	  https://nextjs.org/docs/app/building-your-application/rendering/edge-and-nodejs-runtimes

Reproduction

In my testing I've actually found two methods of triggering this error.

  1. DeJayDev/error-edge-runtime-reproduction@hybrid.

    • Attempting to use the not-found.tsx file in a hybrid pages/app router project as shown at https://github.com/DeJayDev/error-edge-runtime-reproduction/commit/415665a0b21c4e495ce046f94557dd00e9007f8a will trigger this error. The Metadata from layout.tsx is important, as it forces the layout, and thus all pages on the app router to be using the edge runtime. The not-found (_error) component cannot be nested in this case.
  2. DeJayDev/error-edge-runtime-reproduction@ssr-error

    • This one may be slightly unrelated, but still results in the same error. By following Vercel's documentation on using a custom error component in Pages Router projects for "Reusing the built in error page", we find ourselves in a situation where Next.js wants you to define the runtime as experimental-edge, but Next on Pages needs the runtime to be defined as edge. All I've done for this one is add the sample component with the edge runtime rule, tripping up vercel build.

My understanding is hybrid Pages and App Router apps are the predominant case of this issue. As when using not-found.tsx in an App Router project with the edge runtime specified, Next on Pages correctly generates the _not-found Edge Function. Without the edge runtime, it builds as _error.rsc.json.

My situation which required needing to entirely delete the _error and _not-found pages isn't something I've been able to reproduce.

Pages Deployment Method

None

Pages Deployment ID

No response

Additional Information

This title may not be great and if you need clarification on anything please ask. I'm quick to respond :)

Would you like to help?

  • [X] Would you like to help fixing this bug?

DeJayDev avatar Jun 30 '24 23:06 DeJayDev

I met the same issue when adding a middleware in app router, next.js expects to use experimental-edge but the cf build tool only accepts edge runtime

KagamiChan avatar Sep 29 '24 08:09 KagamiChan

You might want to try experimenting with https://opennext.js.org/cloudflare, which has supports dynamic error pages. Would love feedback on if this solves what you're running into.

irvinebroque avatar Sep 29 '24 10:09 irvinebroque

@irvinebroque that's quite exciting! looking forward to the support for middleware

KagamiChan avatar Sep 29 '24 11:09 KagamiChan

any updates on this, I am facing the same error, I am using the pages router and don't have a _error.tsx page.

Image

a-eid avatar Feb 14 '25 21:02 a-eid

Hello 🙂 Thank you for the issue and apologies for the late reply.

Earlier this year we released our Cloudflare adapter for OpenNext, and we have been continuously investing effort in its improvement since then. Existing deployments can continue to use the next-on-pages tooling, but the Cloudflare adapter for OpenNext is currently stable and recommended for deployment of Next.js applications to Cloudflare.

As such, we will no longer be maintaining next-on-pages. We recently deprecated the package on npm and we plan to archive this repo on Monday Sep 29, 2025. In preparation for archival, we are closing all open issues and PRs.

If you have concerns, please feel free to reply here before the repo is archived (after that, it will no longer be possible to comment) or to reach out to our team on Discord.

Thanks so much for using and contributing to next-on-pages 🧡

dario-piotrowicz avatar Sep 26 '25 23:09 dario-piotrowicz