I am developing an application to learn NextJS and getting deeper to its concepts.
Im following a course that teaches most needed things to build a full-stack application using NextJS.
The stack I'm using : NextJS, Prisma, Postgresql, AuthJS
I'm consistently getting this error when I bring up my development server with :
npm run dev
TypeError: Cannot read properties of undefined (reading 'modules')
This error only appears when I use middleware to protect some routes in my app.
These are files and information you may need to help me:
package.json
{
"name": "next-match",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev --turbopack",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@auth/prisma-adapter": "^2.10.0",
"@heroui/react": "^2.7.11",
"@hookform/resolvers": "^5.1.1",
"@prisma/client": "^6.11.1",
"bcrypt": "^6.0.0",
"framer-motion": "^12.19.1",
"next": "15.3.4",
"next-auth": "^5.0.0-beta.29",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-hook-form": "^7.58.1",
"react-icons": "^5.5.0",
"react-toastify": "^11.0.5",
"zod": "^3.25.67"
},
"devDependencies": {
"@eslint/eslintrc": "^3",
"@types/bcrypt": "^5.0.2",
"@types/node": "^20",
"@types/react": "^19",
"@types/react-dom": "^19",
"autoprefixer": "^10.4.21",
"eslint": "^9",
"eslint-config-next": "15.3.4",
"postcss": "^8.5.6",
"prisma": "^6.10.1",
"tailwindcss": "3.4.17",
"typescript": "^5"
}
}
auth.ts
import NextAuth from "next-auth";
import authConfig from "@/auth.config";
import { PrismaAdapter } from "@auth/prisma-adapter";
import { prisma } from "./lib/prisma";
export const { handlers, auth, signIn, signOut } = NextAuth({
callbacks: {
session: async ({ token, session }) => {
if (token.sub && session.user) {
session.user.id = token.sub;
}
return session;
},
},
adapter: PrismaAdapter(prisma),
session: { strategy: "jwt" },
...authConfig,
});
auth.config.ts
import Credentials from "next-auth/providers/credentials";
import type { NextAuthConfig } from "next-auth";
import { loginSchema } from "./lib/schemas/login-form-schema";
import { getUserByEmail } from "./app/actions/auth-actions";
import { compare } from "bcrypt";
export default {
providers: [
Credentials({
name: "credentials",
authorize: async (creds) => {
const validated = loginSchema.safeParse(creds);
if (validated.success) {
const { email, password } = validated.data;
const user = await getUserByEmail(email);
if (!user || !(await compare(password, user.password))) return null;
return user;
}
return null;
},
}),
],
} satisfies NextAuthConfig;
middleware.ts
import { NextResponse } from "next/server";
import { AUTH_ROUTES, PUBLIC_ROUTES } from "./routes";
import { auth } from "./auth";
export default auth((req) => {
const { nextUrl } = req;
const isLoggedIn = !!req.auth;
const isPublic = PUBLIC_ROUTES.includes(nextUrl.pathname);
const isAuthRoute = AUTH_ROUTES.includes(nextUrl.pathname);
if (isPublic) {
return NextResponse.next();
}
if (isAuthRoute) {
if (isLoggedIn) {
return NextResponse.redirect(new URL("/members", nextUrl));
}
return NextResponse.next();
}
if (!isPublic && !isLoggedIn) {
return NextResponse.redirect(new URL("/login", nextUrl));
}
return NextResponse.next();
});
export const config = {
matcher: ["/((?!api|_next/static|_next/image|favicon.ico).*)"],
};
Operating System:
Platform: darwin
Arch: arm64
Version: Darwin Kernel Version 24.5.0: Tue Apr 22 19:48:46 PDT 2025; root:xnu-11417.121.6~2/RELEASE_ARM64_T8103
Available memory (MB): 8192
Available CPU cores: 8
Binaries:
Node: 22.17.0
npm: 10.9.2
Yarn: N/A
pnpm: 10.12.4
Relevant Packages:
next: 15.3.4 // There is a newer version (15.3.5) available, upgrade recommended!
eslint-config-next: 15.3.4
react: 19.1.0
react-dom: 19.1.0
typescript: 5.8.3
Next.js Config:
output: N/A
Course repo: https://github.com/TryCatchLearn/next-match
What I tired:
- At first I was using pnpm, I changed to npm to match the course instructions
- I split configuration as you see in the code
- I changed prisma-adapter and next-auth to match course version
Nothing worked.
Thanks <3