foreign-sapphire•17mo ago

Compile error next-auth

Generated project: Nextjs + Ant Design+ Hasura + Auth0. Unzipped, npm install, npm run dev and failed to compile. Some workeround seems to be add next-auth package to list of transpilePackages in next.config.js but I'm not sure if it's expected behaviour. anyway it will compile but then throws an error :

Unhandled Runtime Error
Error: React Context is unavailable in Server Components
Call Stack
SessionProvider
node_modules/next-auth/react/index.js (451:10)

Unhandled Runtime Error
Error: React Context is unavailable in Server Components
Call Stack
SessionProvider
node_modules/next-auth/react/index.js (451:10)

I've tried also with GoogleAuth, ChakraUI... this same. Only working solution was without authorisation (without next-auth) I'm on Mac, node v19.9, npm 9.6.3.

15 Replies

kapa.ai•17mo ago

Hi @pshemo_s. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

kapa.ai•17mo ago

---------------------- Hmm, I don't know enough to give you a confident answer yet. However, you can refer to the refine documentation and examples for more information: - Next.js documentation in refine (https://refine.dev/docs/packages/documentation/routers/nextjs/) - NextAuth - Google And GitHub Authentications for Nextjs (https://refine.dev/blog/nextauth-google-github-authentication-nextjs) These resources might help you find a solution to your issue. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

Next.js | refine

refine provides router bindings and utilities for Next.js. This package will provide easy integration between refine and Next.js for both existing projects and new projects without giving up the benefits of Next.js.

NextAuth - Google And GitHub Authentications for Nextjs | refine

How to implement Google and GitHub authentications using NextAuth.js in Next.js?

kapa.ai•17mo ago

<@682280607295733905> kapa.ai is still learning and improving, please let us how it did by reacting below

variable-lime•17mo ago

1 month ago, antd was throwing error like this, we solve that problem adding antd to transpilePackages. then antd solve that issue. No longer nessecersy to add antd to transpilePackages. i mean, it's totally okay to add next-auth to transpilePackages. i will debug and check issues on next-auth repository after that i will inform you with more detail. Meanwhile i believe you can continue to develop with transpilePackages

foreign-sapphire•17mo ago

Actually it only solve the compilation issue. Then I stuck on the issue with SessionProvider mentioned above:

foreign-sapphire•17mo ago

I have no idea what wrong with my configured project, as I belive more people generate such project and I didn't found any mention about such issue ;-). Unfortunatelly it's a blocker for me to go forward as I'm unable to run authorisation in my project 😦

variable-lime•17mo ago

I need to debug more to understand issue. can you provide me your project ? any github, codesandbox or any zip file its okay

foreign-sapphire•17mo ago

Yes, sure. It's downloaded from here https://refine.new/api/.refine/d/Mm7jaXUdW4ROc4d

variable-lime•17mo ago

hmm. i did open the project on development and production build. what steps should i follow to the reproduce this error ?

foreign-sapphire•17mo ago

'npm install' 'npm run dev' Just regular as recommended, nothing changed, clean install Which node version are you running? Seems that the root cause is in next-auth module combined with OSX environment. "next-auth": 4.20.0 - works without any issues ^4.21.0" - fail with errors mentioned above

variable-lime•17mo ago

System: - OS: macOS 13.2.1 - CPU: (8) arm64 Apple M1 Pro Binaries: - Node: 18.5.0 - ~/.nvm/versions/node/v18.5.0/bin/node - Yarn: 1.22.17 - /opt/homebrew/bin/yarn - npm: 8.12.1 - ~/.nvm/versions/node/v18.5.0/bin/npm Browsers: - Chrome: 114.0.5735.90 - Firefox: Not Found - Safari: 16.3 this have version "next-auth": "^4.20.1", you can try 4.22.1 (latest)

foreign-sapphire•17mo ago

I've also tried the 4.22.1 (latest) - unfortunately it failed:-( I'll stick now to 4.20 to go forward with development and check later again on staging environment. Thx for your help and effort - it saved me hours as you were able to run it on your environment (let me focus on checking dependences) 👌🤝😊

variable-lime•17mo ago

i'm happy to help but @pshemo_s I did install 4.22.1 and its works as expected. i couldn't reproduced the issue on this example https://refine.new/api/.refine/d/Mm7jaXUdW4ROc4d 😕

foreign-sapphire•17mo ago

I guess it's something strongly related to my environment (Mac architecture, OS related ...). I have not yet any idea what, but...workaround works now 😎