Is Clerk middleware setup usable with NextJS nodejs runtime?

[verdverm]

Preliminary Checks

• I have reviewed the documentation: https://clerk.com/docs

• I have searched for existing issues: https://github.com/clerk/javascript/issues

• I have not already reached out to Clerk support via email or Discord (if you have, no need to open an issue here)

• This issue is not a question, general help request, or anything other than a bug report directly related to Clerk. Please ask questions in our Discord community: https://clerk.com/discord.

Reproduction / Replay Link

asdf

Publishable key

asdf

Description

I'm getting the following error when trying to yarn build for production with NextJS and the nodejs runtime

./node_modules/scheduler/cjs/scheduler.production.min.js
A Node.js API is used (setImmediate at line: 51) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

Import trace for requested module:
./node_modules/scheduler/cjs/scheduler.production.min.js
./node_modules/scheduler/index.js
./node_modules/react-dom/cjs/react-dom.production.min.js
./node_modules/react-dom/index.js
./node_modules/@clerk/clerk-react/dist/esm/utils/useCustomElementPortal.js
./node_modules/@clerk/clerk-react/dist/esm/utils/index.js
./node_modules/@clerk/clerk-react/dist/esm/contexts/ClerkProvider.js
./node_modules/@clerk/clerk-react/dist/esm/contexts/index.js
./node_modules/@clerk/clerk-react/dist/esm/index.js
./node_modules/@clerk/nextjs/dist/esm/client-boundary/hooks.js
./node_modules/@clerk/nextjs/dist/esm/index.js

Environment

asdf

[verdverm]

Or maybe it's more that there are functions used which are not available in the Edge runtime? (I'm trying to use node, but middleware does not seem to be available in node...?)

./node_modules/scheduler/cjs/scheduler.production.min.js
A Node.js API is used (setImmediate at line: 51) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

Import trace for requested module:
./node_modules/scheduler/cjs/scheduler.production.min.js
./node_modules/scheduler/index.js
./node_modules/react-dom/cjs/react-dom.production.min.js
./node_modules/react-dom/index.js
./node_modules/@clerk/clerk-react/dist/esm/utils/useCustomElementPortal.js
./node_modules/@clerk/clerk-react/dist/esm/utils/index.js
./node_modules/@clerk/clerk-react/dist/esm/contexts/ClerkProvider.js
./node_modules/@clerk/clerk-react/dist/esm/contexts/index.js
./node_modules/@clerk/clerk-react/dist/esm/index.js
./node_modules/@clerk/nextjs/dist/esm/client-boundary/controlComponents.js
./node_modules/@clerk/nextjs/dist/esm/index.js

./node_modules/scheduler/cjs/scheduler.production.min.js
A Node.js API is used (setImmediate at line: 51) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

Import trace for requested module:
./node_modules/scheduler/cjs/scheduler.production.min.js
./node_modules/scheduler/index.js
./node_modules/react-dom/cjs/react-dom.production.min.js
./node_modules/react-dom/index.js
./node_modules/@clerk/clerk-react/dist/esm/utils/useCustomElementPortal.js
./node_modules/@clerk/clerk-react/dist/esm/utils/index.js
./node_modules/@clerk/clerk-react/dist/esm/contexts/ClerkProvider.js
./node_modules/@clerk/clerk-react/dist/esm/contexts/index.js
./node_modules/@clerk/clerk-react/dist/esm/index.js
./node_modules/@clerk/nextjs/dist/esm/client-boundary/controlComponents.js
./node_modules/@clerk/nextjs/dist/esm/index.js

./node_modules/scheduler/cjs/scheduler.production.min.js
A Node.js API is used (MessageChannel at line: 120) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

Import trace for requested module:
./node_modules/scheduler/cjs/scheduler.production.min.js
./node_modules/scheduler/index.js
./node_modules/react-dom/cjs/react-dom.production.min.js
./node_modules/react-dom/index.js
./node_modules/@clerk/clerk-react/dist/esm/utils/useCustomElementPortal.js
./node_modules/@clerk/clerk-react/dist/esm/utils/index.js
./node_modules/@clerk/clerk-react/dist/esm/contexts/ClerkProvider.js
./node_modules/@clerk/clerk-react/dist/esm/contexts/index.js
./node_modules/@clerk/clerk-react/dist/esm/index.js
./node_modules/@clerk/nextjs/dist/esm/client-boundary/controlComponents.js
./node_modules/@clerk/nextjs/dist/esm/index.js

./node_modules/scheduler/cjs/scheduler.production.min.js
A Node.js API is used (MessageChannel at line: 121) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

Import trace for requested module:
./node_modules/scheduler/cjs/scheduler.production.min.js
./node_modules/scheduler/index.js
./node_modules/react-dom/cjs/react-dom.production.min.js
./node_modules/react-dom/index.js
./node_modules/@clerk/clerk-react/dist/esm/utils/useCustomElementPortal.js
./node_modules/@clerk/clerk-react/dist/esm/utils/index.js
./node_modules/@clerk/clerk-react/dist/esm/contexts/ClerkProvider.js
./node_modules/@clerk/clerk-react/dist/esm/contexts/index.js
./node_modules/@clerk/clerk-react/dist/esm/index.js
./node_modules/@clerk/nextjs/dist/esm/client-boundary/controlComponents.js
./node_modules/@clerk/nextjs/dist/esm/index.js

./node_modules/@clerk/shared/dist/chunk-RSOCGYTF.mjs
A Node.js API is used (MessageEvent at line: 27) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

Import trace for requested module:
./node_modules/@clerk/shared/dist/chunk-RSOCGYTF.mjs
./node_modules/@clerk/shared/dist/index.mjs
./node_modules/@clerk/clerk-react/dist/esm/components/uiComponents.js
./node_modules/@clerk/clerk-react/dist/esm/components/index.js
./node_modules/@clerk/clerk-react/dist/esm/index.js
./node_modules/@clerk/nextjs/dist/esm/client-boundary/controlComponents.js
./node_modules/@clerk/nextjs/dist/esm/index.js

[LekoArts]

Please use GitHub discussions if you have a question. If you want to report a bug, please use the provided template and fill everything out. We can't help you if you fill in "asdf" everywhere - thanks!

[verdverm]

Now that you converted it to a discussion, will you be answering it? The discussion form does not have all the same required fields

[panteliselef]

This is likely caused due to codesplitting. Try importing auth or any other clerk utility from @clerk/nextjs/server instead of @clerk/nextjs.

[canadaduane]

We are experiencing this also, but as far as I can tell, we are importing auth and other utils from @clerk/nextjs/server where appropriate. Our output is identical to @verdverm's output, e.g.

Import trace for requested module:
./node_modules/scheduler/cjs/scheduler.production.min.js
./node_modules/scheduler/index.js
./node_modules/react-dom/cjs/react-dom.production.min.js
./node_modules/react-dom/index.js
./node_modules/next/dist/esm/client/script.js
./node_modules/next/dist/esm/shared/lib/router/router.js
./node_modules/next/dist/esm/client/router.js
./node_modules/next/dist/esm/api/router.js
./node_modules/@clerk/nextjs/dist/esm/pages/ClerkProvider.js
./node_modules/@clerk/nextjs/dist/esm/client-boundary/ClerkProvider.js
./node_modules/@clerk/nextjs/dist/esm/components.client.js
./node_modules/@clerk/nextjs/dist/esm/index.js

./node_modules/@clerk/shared/dist/chunk-RSOCGYTF.mjs
A Node.js API is used (MessageEvent at line: 27) which is not supported in the Edge Runtime.
Learn more: https://nextjs.org/docs/api-reference/edge-runtime

... etc ...

[JeremyKennedy]

I can confirm that changing my imports for authMiddleware, auth, and currentUser from @clerk/nextjs to @clerk/nextjs/server has resolved the issue. Note that any of the components, like UserButton, still had to import from @clerk/nextjs.

However, after seeing this, I've tried only updating the import for authMiddleware. This works too! I compared the output sizes, and keeping @clerk/nextjs/server whenever possible does indeed reduce size a bit, but only when @clerk/nextjs is not imported at all in that file.

[jescalan]

https://github.com/orgs/clerk/discussions/3829