Runtime Error, TypeError, no idea where to search for the error
Unanswered
Transvaal lion posted this in #help-forum
Transvaal lionOP
Greetings people from the internet, i followed the guide from the prisma docs and the v5 of next-auth, now the moment i start my app i get a runtime error saying it couldnt read properties of undefined, i am pretty much a beginner to nextjs and i have no idea where i even could start searching for the error in my code. anyone an idea?
console output:
project file tree:
(see image)
---
any help is deeply appreciated
console output:
▲ Next.js 15.3.2 (Turbopack)
- Local: http://localhost:3000
- Network: http://172.20.10.3:3000
- Environments: .env.local, .env
✓ Starting...
✓ Compiled middleware in 104ms
✓ Ready in 626ms
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
✓ Compiled /_error in 301ms
GET / 404 in 2ms
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
⨯ [Error [TypeError]: Cannot read properties of undefined (reading 'modules')]
○ Compiling /_not-found/page ...
✓ Compiled /_not-found/page in 810ms
project file tree:
(see image)
---
any help is deeply appreciated
70 Replies
@Anay-208 | Ping in replies Can you try disabling turbopack.
Go to package.json and remove that arg
Transvaal lionOP
tried that already, still no different results
@Anay-208 | Ping in replies What’s your OS?
Transvaal lionOP
iam on Sequoia 15.5
When you create a fresh project, does the app run fine?
Transvaal lionOP
yes it does, it must be something i added through the guide from either prisma or nextauth, but i cannot tell cause the error is basically not really telling anything
Can you just check on which step you exactly get the error by retrying?
Transvaal lionOP
https://authjs.dev/getting-started/installation
https://www.prisma.io/docs/getting-started/setup-prisma/add-to-existing-project/relational-databases/connect-your-database-typescript-postgresql
these are the 2 guides ive been following for reference
https://www.prisma.io/docs/getting-started/setup-prisma/add-to-existing-project/relational-databases/connect-your-database-typescript-postgresql
these are the 2 guides ive been following for reference
@Anay-208 | Ping in replies Can you just check on which step you exactly get the error by retrying?
Transvaal lionOP
you mean redo the entire thing once more to see when it starts misbehaving?
Exactly, first of all you should do prisma and run a test query to see if it runs fine
Transvaal lionOP
allright, that gonna be a long night, ill post a update here when i run into it again
@Anay-208 | Ping in replies Exactly, first of all you should do prisma and run a test query to see if it runs fine
Transvaal lionOP
as soon as i remove the middleware file
it works
export { auth as middleware } from "@/auth"
it works
Can you share code for @/auth?
Transvaal lionOP
one second
@Anay-208 | Ping in replies Can you share code for @/auth?
Transvaal lionOP
import NextAuth from "next-auth"
import Credentials from "next-auth/providers/credentials"
import {saltAndHashPassword} from "@/lib/utils/password"
import {getUserFromDb} from "@/lib/utils/db";
import {signInSchema} from "@/lib/zod";
import {PrismaAdapter} from "@auth/prisma-adapter";
import {prisma} from "@/prisma";
export const {handlers, signIn, signOut, auth} = NextAuth({
adapter: PrismaAdapter(prisma),
providers: [
Credentials({
credentials: {
email: {},
password: {},
},
authorize: async (credentials) => {
let user = null
const {email, password} = await signInSchema.parseAsync(credentials)
const pwHash = await saltAndHashPassword(password)
user = await getUserFromDb(email, pwHash)
if (!user) {
throw new Error("Invalid credentials.")
}
return user
},
}),
],
})
Now to narrow down the error, just add middleware file again with the same content, comment everything hashing related, does it work then, I just want to check the error right now
when i commented it out it works with middleware added
@Transvaal lion bcrypt seems to be the issue
Are you using edge runtime?
Transvaal lionOP
not that i know at least
how can i figure out?
@Transvaal lion how can i figure out?
Are you exporting “runtime” in any route
@Anay-208 | Ping in replies Are you exporting “runtime” in any route
Transvaal lionOP
when searching globally for "runtime" (without the quotes) the only thing showing up are inside the package-lock.json so i doubt that
And in which guide did you see to use bcrypt?
@Anay-208 | Ping in replies And in which guide did you see to use bcrypt?
Transvaal lionOP
inside the authjs guide there was a method well 2 actually you had to implement yourself, which were the hashing and the getUserFromDb method, so i googled around and first thing was bcrypt that showed up
Though the issue is actually implementation, I’m just suggesting a better alternative
@Anay-208 | Ping in replies Though the issue is actually implementation, I’m just suggesting a better alternative
Transvaal lionOP
ye its a good point, i got a error now that at least gives me somewhat of a hint but googleing around didnt help much, i dont think this is a compiler issue
and i guess its indeed using the edge runtime
@Transvaal lion and i guess its indeed using the edge runtime
Oh I forgot middleware used edge runtime by default
Was it mentioned in the docs to hash in middleware
Because hashing is supposed to be done in server action or route
@Anay-208 | Ping in replies Because hashing is supposed to be done in server action or route
Transvaal lionOP
well isnt it a server action already? i made the "use server" on top so it doesnt run in the client
"use server"
import argon2 from 'argon2';
// Function to salt and hash a password
export async function saltAndHashPassword(password: string): Promise<string> {
try {
return await argon2.hash(password);
} catch (error) {
throw new Error(`Password hashing failed: ${error instanceof Error ? error.message : 'Unknown error'}`);
}
}
You might be importing a file which is importing argon2
Transvaal lionOP
thats true
@Anay-208 | Ping in replies You might be importing a file which is importing argon2
Transvaal lionOP
exposing the hasher as a api endpoint kind of works but this is dirty af, is there a way to make it a "real server action" so i get independet of this edge runtime?
@Transvaal lion exposing the hasher as a api endpoint kind of works but this is dirty af, is there a way to make it a "real server action" so i get independet of this edge runtime?
My question is why do you want to use it in edge runtime?
@Anay-208 | Ping in replies My question is why do you want to use it in edge runtime?
Transvaal lionOP
well it seems like i cannot get around it on the middleware part for some reason, my goal is to have a fully local RBAC with 5 roles as i cannot use any cloud providers, its an app that will run only in company network
I mean why are you using it in middleware**
Middleware by default uses edge runtime.
I can help you fix it, but it can cause more issues in the future
I can help you fix it, but it can cause more issues in the future
You don’t need to hash in middleware
Transvaal lionOP
how else am i configuring the auth.ts file so that the authorize method works correctly in the credentials provider?
the password check happens there and that is used by middleware as well
@Anay-208 | Ping in replies You don’t need to hash in middleware
Transvaal lionOP
maybe is there some sort of template for a whole nextjs thing that has this implemented already? tho i couldnt find one yet
There is no use case for hashing in middleware
@Transvaal lion the password check happens there and that is used by middleware as well
You’re not supposed to check password in middleware
@Anay-208 | Ping in replies You’re not supposed to check password in middleware
Transvaal lionOP
what am i then doing wrong?
the middleware imports its stuff from the auth.ts file and the authorize method auth.ts file has the hashing there
the middleware imports its stuff from the auth.ts file and the authorize method auth.ts file has the hashing there
@Transvaal lion what am i then doing wrong?
the middleware imports its stuff from the auth.ts file and the authorize method auth.ts file has the hashing there
You’re importing authorize function from auth.ts?
For middleware don’t import from any file which is importing hashing related functions
@Anay-208 | Ping in replies For middleware don’t import from any file which is importing hashing related functions
Transvaal lionOP
then iam really confused on what to change and how, the files ive sent here for the auth part are still the same
inside step 3 authorize
No about the middleware
I can give you a simple way to fix it right now, if docs explicitly say that, while I look for a better solution
@Anay-208 | Ping in replies I can give you a simple way to fix it right now, if docs explicitly say that, while I look for a better solution
Transvaal lionOP
that would be nice
Can you first send link for docs where it asks you to use middleware
Here is how to fix the issue for now, but I wouldn’t recommend this; https://nextjs.org/blog/next-15-2#nodejs-middleware-experimental
I’ll look into this
I’ll look into this
Transvaal lionOP
step 3 last part
next thing is gotta figure out how i can add roles to users, and make pages accessible based on that
Don’t close the thread yet, I’ll get back to you with a solution
@Anay-208 | Ping in replies Don’t close the thread yet, I’ll get back to you with a solution
Transvaal lionOP
i wont close it, iam pretty sure i gonna run in many more problems
https://nextjs.org/learn/dashboard-app/adding-authentication
Check middleware implementation here
Check middleware implementation here
nvm he left the server(just wanted to tell him a better implementation)