next.js [12.3] Cannot read properties of undefined (reading 'files') on `next build`

Verify canary release

[X] I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP Wed Jul 27 02:20:31 UTC 2022
Binaries:
  Node: 17.8.0
  npm: 8.5.5
  Yarn: 3.2.3
  pnpm: 7.5.2
Relevant packages:
  next: 12.3.1-canary.0
  eslint-config-next: N/A
  react: 18.2.0
  react-dom: 18.2.0

What browser are you using? (if relevant)

N/A

How are you deploying your application? (if relevant)

Vercel

Describe the Bug

After upgrading from 12.2.5 to 12.3.0 my Vercel deployments are now failing with:

TypeError: Cannot read properties of undefined (reading 'files')
--
19:49:00.094 | at /vercel/path0/node_modules/next/dist/build/utils.js:680:33
19:49:00.094 | at Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/trace/trace.js:79:26)
19:49:00.094 | at Object.isPageStatic (/vercel/path0/node_modules/next/dist/build/utils.js:674:29)
19:49:00.094 | at execFunction (/vercel/path0/node_modules/next/dist/compiled/jest-worker/processChild.js:1:2828)
19:49:00.094 | at execHelper (/vercel/path0/node_modules/next/dist/compiled/jest-worker/processChild.js:1:2486)
19:49:00.095 | at execMethod (/vercel/path0/node_modules/next/dist/compiled/jest-worker/processChild.js:1:2574)
19:49:00.095 | at process.messageListener (/vercel/path0/node_modules/next/dist/compiled/jest-worker/processChild.js:1:1284)
19:49:00.095 | at process.emit (node:events:527:28)
19:49:00.095 | at emit (node:internal/child_process:938:14)
19:49:00.095 | at processTicksAndRejections (node:internal/process/task_queues:84:21)
19:49:00.098 |  
19:49:00.098 | > Build error occurred
19:49:00.101 | Error: Failed to collect page data for /404
19:49:00.101 | at /vercel/path0/node_modules/next/dist/build/utils.js:777:15
19:49:00.101 | at processTicksAndRejections (node:internal/process/task_queues:96:5) {
19:49:00.101 | type: 'Error'
19:49:00.101 | }

Running next build locally also results in a similar error.

Of important note is that I'm using:

module.exports = {
	experimental: {
		runtime: 'experimental-edge',
	},
}

And when I remove the experimental-edge runtime, the problem goes away. So I'm thinking it's some combination of experimental-edge with 12.3.0 that causes the problem.

Expected Behavior

No failure during builds.

Link to reproduction

N/A

To Reproduce

Wasn't able to create a repro example on StackBlitz because this issue seems to only impact experimental-edge runtimes and StackBlitz doesn't support it.

I'm struggling to create a minimal repro that has this occur consistently. Was hoping someone on your team might be able to see any clues from the stacktrace that could point me in the right direction.

I have some 12.3.0 experimental-edge Next js apps where this problem occurs, and some where it doesn't, so I'm sure there's some 3rd variable here at play here but I haven't been able to find it yet.

Sep 09 '22 04:09 EvHaus

Removing the custom _error.page.tsx fixed it for me. Note I use custom extensions, haven't tested without.

Not a solution, but step in the right direction of what the '3rd variable' is/might be.

Oct 21 '22 17:10 bjarn

Just a note that this occurs in Next.js 13 as well when I try to build a project using the edge runtime and the pages directory.

The only workaround appears to be removing my 404.tsx and 500.tsx pages.

Nov 02 '22 12:11 james-elicx

Just to confirm that I'm getting the same error with my 404 and 500 pages, using the edge-runtime option and Next 13.

Nov 03 '22 19:11 pablodavila95

Same here

Dec 05 '22 18:12 IvanGrimes

Just putting this here.

I've found the following block of code in /packages/next/build/entries.ts (12.3+ and 13.x):

  if (params.page === '/_document') {
    await params.onServer()
    return
  }
  if (
    params.page === '/_app' ||
    params.page === '/_error' ||
    params.page === '/404' ||
    params.page === '/500'
  ) {
    await Promise.all([params.onClient(), params.onServer()])
    return
  }
  if (isEdgeRuntime(params.pageRuntime)) {
    await Promise.all([params.onClient(), params.onEdgeServer()])
    return
  }
  await Promise.all([params.onClient(), params.onServer()])
  return

This means that /_document is only ever built for the server (not edge runtime), /_app, /_error, /404, and /500 are only built for client and server (but not edge runtime), and everything else is built for the edge runtime or server, case depending, in addition to the client.

This is why '/404' will give an error during the build for edge (or experimental-edge) runtime, as its entry point is never compiled.

It seems some of these choices are by design, but it might be worth seeing if someone on the project can revisit this. Specifically I kind of feel like the /404 and /500 shouldn't be in this list.

Either that, or build() in /packages/next/src/build/index.ts should be excluding /400 and /500 so that even if those files exist in the file system, the build system won't try to include them when building the edge runtime files.

For now I guess I'll have to go with these two not being supported in the edge runtime.

Jan 31 '23 04:01 harmony7

Still happens in 13.2.1

Feb 25 '23 17:02 berkaytheunicorn

Still happens in 13.2.1

Yes. I'm moving out of Vercel completely just for this error. It's unfortunate but I'm generating a lot of video edits programmatically and need access to be able to read files.