<LoginLink> / <RegisterLink> causes: "Error: (0 , react__WEBPACK_IMPORTED_MODULE_0__.createContext)"
CODE CAUSES ERROR:
ERROR:
import { LoginLink, RegisterLink } from "@kinde-oss/kinde-auth-nextjs";
// ...
<div>
<LoginLink>Sign in</LoginLink>
<RegisterLink>Sign up-</RegisterLink>
</div>
import { LoginLink, RegisterLink } from "@kinde-oss/kinde-auth-nextjs";
// ...
<div>
<LoginLink>Sign in</LoginLink>
<RegisterLink>Sign up-</RegisterLink>
</div>
Server Error
Error: (0 , react__WEBPACK_IMPORTED_MODULE_0__.createContext) is not a function
This error happened while generating the page. Any console logs will be displayed in the terminal window.
Call Stack
s
node_modules\@kinde-oss\kinde-auth-nextjs\dist\index.js (1:11579)
(rsc)/./node_modules/@kinde-oss/kinde-auth-nextjs/dist/index.js
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/.next/server/vendor-chunks/@kinde-oss.js (20:1)
__webpack_require__
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/.next/server/webpack-runtime.js (33:42)
eval
webpack-internal:///(rsc)/./src/app/page.tsx (8:86)
(rsc)/./src/app/page.tsx
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/.next/server/app/page.js (195:1)
Function.__webpack_require__
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/.next/server/webpack-runtime.js (33:42)
runNextTicks
node:internal/process/task_queues (60:5)
listOnTimeout
node:internal/timers (540:9)
process.processTimers
node:internal/timers (514:7)
async eq
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (35:402260)
async tr
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (35:405987)
async tn
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (35:406537)
async tn
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (35:406668)
async tu...
Server Error
Error: (0 , react__WEBPACK_IMPORTED_MODULE_0__.createContext) is not a function
This error happened while generating the page. Any console logs will be displayed in the terminal window.
Call Stack
s
node_modules\@kinde-oss\kinde-auth-nextjs\dist\index.js (1:11579)
(rsc)/./node_modules/@kinde-oss/kinde-auth-nextjs/dist/index.js
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/.next/server/vendor-chunks/@kinde-oss.js (20:1)
__webpack_require__
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/.next/server/webpack-runtime.js (33:42)
eval
webpack-internal:///(rsc)/./src/app/page.tsx (8:86)
(rsc)/./src/app/page.tsx
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/.next/server/app/page.js (195:1)
Function.__webpack_require__
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/.next/server/webpack-runtime.js (33:42)
runNextTicks
node:internal/process/task_queues (60:5)
listOnTimeout
node:internal/timers (540:9)
process.processTimers
node:internal/timers (514:7)
async eq
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (35:402260)
async tr
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (35:405987)
async tn
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (35:406537)
async tn
file:///C:/Users/CASPER/Desktop/projeler/convexstack/convex-playground/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (35:406668)
async tu...
3 Replies
npm: '10.2.2',
node: '20.8.0',
Next.js v14.1.0
I have resolved the issue. I'm not certain what the exact cause was, but here are the steps I took:
Created a new project.
Transferred code to the new project.
Verified and updated npm package versions as needed.
These actions resulted in the code working as intended. This information may be useful for future troubleshooting.
{
"name": "convex-playground",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@hookform/resolvers": "^3.3.4",
"@kinde-oss/kinde-auth-nextjs": "^2.1.15",
"@radix-ui/react-checkbox": "^1.0.4",
"@radix-ui/react-label": "^2.0.2",
"@radix-ui/react-select": "^2.0.0",
"@radix-ui/react-slot": "^1.0.2",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.0",
"lucide-react": "^0.341.0",
"next": "14.1.0",
"react": "^18",
"react-dom": "^18",
"react-hook-form": "^7.50.1",
"tailwind-merge": "^2.2.1",
"tailwindcss-animate": "^1.0.7",
"zod": "^3.22.4"
},
"devDependencies": {
"@types/node": "^20",
"@types/react": "^18",
"@types/react-dom": "^18",
"autoprefixer": "^10.0.1",
"eslint": "^8",
"eslint-config-next": "14.1.0",
"postcss": "^8",
"tailwindcss": "^3.3.0",
"typescript": "^5"
}
}
{
"name": "convex-playground",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@hookform/resolvers": "^3.3.4",
"@kinde-oss/kinde-auth-nextjs": "^2.1.15",
"@radix-ui/react-checkbox": "^1.0.4",
"@radix-ui/react-label": "^2.0.2",
"@radix-ui/react-select": "^2.0.0",
"@radix-ui/react-slot": "^1.0.2",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.0",
"lucide-react": "^0.341.0",
"next": "14.1.0",
"react": "^18",
"react-dom": "^18",
"react-hook-form": "^7.50.1",
"tailwind-merge": "^2.2.1",
"tailwindcss-animate": "^1.0.7",
"zod": "^3.22.4"
},
"devDependencies": {
"@types/node": "^20",
"@types/react": "^18",
"@types/react-dom": "^18",
"autoprefixer": "^10.0.1",
"eslint": "^8",
"eslint-config-next": "14.1.0",
"postcss": "^8",
"tailwindcss": "^3.3.0",
"typescript": "^5"
}
}
Interesting, I would be curious of the cause here if happens again.
Spooky computer shit