next.js: error TypeError: Cannot read properties of undefined (reading '') when using Next.js runtime edge on turborepo or Nx

Verify canary release

  • I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
      Platform: win32
      Arch: x64
      Version: Windows 10 Pro   
    Binaries:
      Node: 18.16.0
      npm: N/A
      Yarn: N/A
      pnpm: N/A
    Relevant Packages:
      next: 13.4.13-canary.13   
      eslint-config-next: 13.4.1
      react: 18.2.0
      react-dom: 18.2.0
      typescript: 4.9.5
    Next.js Config:
      output: N/A

Which area(s) of Next.js are affected? (leave empty if unsure)

App Router, Middleware / Edge (API routes, runtime)

Link to the code that reproduces this issue or a replay of the bug

https://github.com/NastykSwED/turbo-next-edge

To Reproduce

  1. Run pnpm install to install the dependencies.
  2. Run pnpm dev to get both projects up or run pnpm dev --filter [docs | web].
  3. Go to http://localhost:3001/ or http://localhost:3000/ and see the console for the following error: Screenshot_1

And in the browser: Screenshot_2

Describe the Bug

When using the runtime edge on a monorepo such as turborepo or Nx, the console throws the error: “- error TypeError: Cannot read properties of undefined (reading '')”. This only happens with monorepos, when using standalone applications this does not happen.

Expected Behavior

It should not throw the above error when using a Nextjs app with the runtime edge on a monorepo.

Which browser are you using? (if relevant)

Microsoft Edge Versión 115.0.1901.188 (Compilación oficial) (64 bits)

How are you deploying your application? (if relevant)

No response

NEXT-1513

About this issue

  • Original URL
  • State: open
  • Created a year ago
  • Reactions: 13
  • Comments: 22 (1 by maintainers)

Most upvoted comments

To raise awareness again, this issue is still highly relevant for us and was not fixed, yet. It is still happening with the latest version (14.2.0-canary.54).

Maybe you have a short moment to look at it again @balazsorban44? We have a reproduction repo, detailled error logs in here - is anything else needed?

I finally want to get rid of this issue from my bookmarks bar after 9 months 😃

Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!

Same here now, updated to 14.1.1 and same error as @christophmeise . This i only happening on windows, macOS running fine. But the most confusing part is that canary version tend to work, but have never got latest running without that error.

Here is a link to a new reproduction as the one on the initial post is returning a 404: https://github.com/VaniaPopovic/turborepo-repro

Same here with Windows 11 and Next.js v14.0.3, I have export const runtime = "edge"; at the top of my src/app/layout.tsx to make the whole app run on the edge runtime but it gives me the following error:

 ⨯ Internal error: TypeError: Cannot read properties of undefined (reading '')
    at resolveClientReference (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:53:55)
    at resolveModule (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:1588:35)
    at processFullRow (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:1648:25)
    at processBinaryChunk (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:1751:21)
    at progress (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:1819:17)
    at runNextTicks (node:internal/process/task_queues:60:5)
    at process.processTimers (node:internal/timers:511:9)
[TypeError: Cannot read properties of undefined (reading '')]
 ⨯ [TypeError: Cannot read properties of undefined (reading '')]
 ⨯ [TypeError: Cannot read properties of null (reading 'default')]

I have the same setup, and also the same issue.

Here’s more context that could be useful:

https://github.com/vercel/next.js/blob/eb6aae640f140c40f53503247007e179f6f7ba12/packages/next/src/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js#L63

moduleExports is undefined here. The first time it happens is because (app-pages-browser)/../../node_modules/next/dist/client/components/app-router.js doesn’t exist in the bundlerConfig object.

Windows 11: issue happens on development, but works while building (production) WSL: works fine in both cases

Temp workaround: export const runtime = process.env.NODE_ENV === "development" ? "nodejs" : "experimental-edge"

Now https://github.com/vercel/next.js/issues/52176 has been closed. @balazsorban44

But this issue is still the same. I just tested it again on 14.1.1-canary.77 on Windows 11 with turborepo. Runtime edge is not working in development.

—> TypeError: Cannot read properties of undefined (reading ‘default’) —> at resolveClientReference (…/…/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:87:55)

I tested the exact same setup with WSL and it worked. There is a Windows-specific error that is not resolved, yet.

Same here with Windows 11 and Next.js v14.0.3, I have export const runtime = "edge"; at the top of my src/app/layout.tsx to make the whole app run on the edge runtime but it gives me the following error:

 ⨯ Internal error: TypeError: Cannot read properties of undefined (reading '')
    at resolveClientReference (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:53:55)
    at resolveModule (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:1588:35)
    at processFullRow (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:1648:25)
    at processBinaryChunk (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:1751:21)
    at progress (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:1819:17)
    at runNextTicks (node:internal/process/task_queues:60:5)
    at process.processTimers (node:internal/timers:511:9)
[TypeError: Cannot read properties of undefined (reading '')]
 ⨯ [TypeError: Cannot read properties of undefined (reading '')]
 ⨯ [TypeError: Cannot read properties of null (reading 'default')]

I have the same setup, and also the same issue.

Here’s more context that could be useful:

https://github.com/vercel/next.js/blob/eb6aae640f140c40f53503247007e179f6f7ba12/packages/next/src/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js#L63

moduleExports is undefined here. The first time it happens is because (app-pages-browser)/../../node_modules/next/dist/client/components/app-router.js doesn’t exist in the bundlerConfig object.

Windows 11: issue happens on development, but works while building (production) WSL: works fine in both cases

Temp workaround: export const runtime = process.env.NODE_ENV === "development" ? "nodejs" : "experimental-edge"

This causes the deployment to vercel to fallback to lambda functions instead of edge. Is there anything blocking this piece of work? Anything we can do to help? Been experiencing this issue for months now, and my main working machine is my windows.

Same here with Windows 11 and Next.js v14.0.3, I have export const runtime = "edge"; at the top of my src/app/layout.tsx to make the whole app run on the edge runtime but it gives me the following error:

 ⨯ Internal error: TypeError: Cannot read properties of undefined (reading '')
    at resolveClientReference (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:53:55)
    at resolveModule (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:1588:35)
    at processFullRow (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:1648:25)
    at processBinaryChunk (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:1751:21)
    at progress (../../node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js:1819:17)
    at runNextTicks (node:internal/process/task_queues:60:5)
    at process.processTimers (node:internal/timers:511:9)
[TypeError: Cannot read properties of undefined (reading '')]
 ⨯ [TypeError: Cannot read properties of undefined (reading '')]
 ⨯ [TypeError: Cannot read properties of null (reading 'default')]

The same issue with Nx and NextJS 14, Win 11.

I ran in the same issue using Turborepo and “Edge” runtime on Windows. I tried running the same project on a Macbook and it worked fine.