Next.js Discord

Discord Forum

TypeError: Cannot read properties of undefined (reading 'sodium')

Unanswered
Cornish Rex posted this in #help-forum
Open in Discord
Avatar
Cornish RexOP
Hey, there. I'm getting this error while running the build command. I checked the Next.js repo Issues and Stackoverflow but didn't find much. 
Collecting page data  .TypeError: Cannot read properties of undefined (reading 'sodium')
...
> Build error occurred
Error: Failed to collect page data for /checkout/order/[orderId]/callback/login

Interestingly, this path is not a page but a route handler.
This happened after upgrading from Next.js 13 to 14. 
-        "next": "13.5.6",
+        "next": "14.1.1",

I would appreciate any help. šŸ™

62 Replies

Avatar
Siamese
Was this working perfectly in next13?
Avatar
Cornish RexOP
@Siamese , yep. It was.
Avatar
Siamese
Have you tried removing node_modules and reinstalling all the dependeinces?
Avatar
Cornish RexOP
@Siamese , I did. It is also happening in CI.
Avatar
Siamese
It would be more helpful if you share your whole error log
Avatar
Siamese
@Cornish Rex
Avatar
Cornish RexOP
Sure thing.
Image
Avatar
Siamese
I don't think it will work but worth a try.
remove .next folder from your directory. and build again
Avatar
Cornish RexOP
@Siamese . Trying ...
Avatar
Great golden digger wasp
I just read all of your chat maybe it is happening because of cache.
Avatar
Cornish RexOP
@Siamese, same thing.
@Great golden digger wasp, after removing the /.next, directory is there any other cache I should be aware of?
Avatar
Great golden digger wasp
no
Avatar
Siamese
Are you able to run the project on development mode?
Avatar
Cornish RexOP
@Siamese, yep. Actually I found it in CI.
Avatar
Siamese
Can you build the project locally?
I think you will need to clear the cache of the server as well
Avatar
Great golden digger wasp
Are you using same node js version locally and on production server?
Avatar
Cornish RexOP
Can you build the project locally?
@Siamese, no. It reproduces locally.
Avatar
Great golden digger wasp
?
Avatar
Cornish RexOP
Are you using same node js version locally and on production server?
@Great golden digger wasp, yep.
Avatar
Great golden digger wasp
maybe you should run this command:
npm ls sodium
Avatar
Cornish RexOP
maybe you should run this command:
npm ls sodium
@Great golden digger wasp, I will in an hour. Iā€™m AFK now.
Avatar
Great golden digger wasp
ok
Avatar
Siamese
/api/2023-06-09/checkout/orders/[orderIdentifier]/update-buyer
Do you have this API route in your project?
Avatar
Cornish RexOP
Do you have this API route in your project?
@Siamese, yep. As a route handler. route.ts.
Avatar
Siamese
ping me when you are on your computer. as @Great golden digger wasp it can be the issue with the sodium library itself
That API route is mentioned in the logs. maybe the app needs sodium library for that route. can not say anything without looking at the code of that route šŸ™‚
Avatar
Cornish RexOP
maybe you should run this command:
npm ls sodium
@Great golden digger wasp.
update-next-app# pnpm ls sodium
update-next-app# echo $?
0
ping me when you are on your computer. as @Duraid Mustafa it can be the issue with the sodium library itself
@Siamese, back to keyboard. I appreciate your patience. šŸ™
Avatar
Siamese
please use npm. I am not sure if pnpm works the same way with ls
Avatar
Cornish RexOP
@Siamese. 
update-next-app# npm ls sodium 
crossmint-monorepo@ /Users/juliojordan/update-next-app
ā””ā”€ā”€ (empty)

update-next-app# echo $?       
1
Avatar
Siamese
Can you search in your code base for "sodium" (without the quotes)
I found this sodium library https://github.com/paixaop/node-sodium#readme
Last commit was 5 years ago
@Cornish Rex Just for debugging purposes
Delete files associated with route /api/2023-06-09/checkout/orders/[orderIdentifier]/update-buyer . and then build again.
I was looking at the [migration guide](https://nextjs.org/docs/app/building-your-application/upgrading/version-14) from next 13 to 14

I hope you have upgraded your nextjs with the following command 
pnpm up next react react-dom eslint-config-next --latest


Also If you are using TypeScript, ensure you also upgrade @types/react and @types/react-dom to their latest versions.
Avatar
Cornish RexOP
@Siamese, interesting. Thx! Give me 30 minutes. I'm joining a meeting right now. I'm sorry for the inconvenience.
Avatar
Cornish RexOP
Can you search in your code base for "sodium" (without the quotes)
@Siamese. 
update-next-app# grep sodium pnpm-lock.yaml 
  libsodium-wrappers@0.7.13:
  libsodium@0.7.13:
      libsodium-wrappers: 0.7.13
  libsodium-wrappers@0.7.13:
      libsodium: 0.7.13
  libsodium@0.7.13: {}
update-next-app# ack --ts libsodium .   
update-next-app# echo $?
1
Avatar
Siamese
What about this
and this
Avatar
Cornish RexOP
I hope you have upgraded your nextjs with the following command.
@Siamese, yep. I followed the docs.
Delete files associated with route /api/2023-06-09/checkout/orders/[orderIdentifier]/update-buyer and then build again.
@Siamese, I got the same error but from other path. šŸ˜­ 
TypeError: Cannot read properties of undefined (reading 'sodium')
Build error occurred
Error: Failed to collect page data for /api/2023-06-09/checkout/orders
Avatar
Siamese
Do you have middlewear in your project?
Please Search for "sodium" in your entire codebase (not just in pnpm-lock file)
Share the codeblocks where the sodium is appearing
Avatar
Cornish RexOP
Please Search for "sodium" in your entire codebase (not just in pnpm-lock file)
@Siamese. 
update-next-app# grep --exclude-dir=./apps/crossmint-nextjs/.next --recursive sodium .
./pnpm-lock.yaml:  libsodium-wrappers@0.7.13:
./pnpm-lock.yaml:  libsodium@0.7.13:
./pnpm-lock.yaml:      libsodium-wrappers: 0.7.13
./pnpm-lock.yaml:  libsodium-wrappers@0.7.13:
./pnpm-lock.yaml:      libsodium: 0.7.13
./pnpm-lock.yaml:  libsodium@0.7.13: {}
update-next-app# $?
0
Do you have middlewear in your project?
@Siamese, an auth middleware. 
export async function middleware(request: NextRequest) {
    if (["/console", "/alpha", "/user"].some((path) => request.nextUrl.pathname.startsWith(path))) {
        return authRequestMiddleware(request);
    }
    return NextResponse.next();
}
Avatar
Siamese
If your development server is working perfectly fine but not the build. generally the problem is related to caching
Can you test something
Start the project in development mode
Open pages that are fetching data from route /api/2023-06-09/checkout/orders/[orderIdentifier]/update-buyer or the other routes that were mentioned in the error
I do not see any problem in your middleware, and there is no sodium in your code base as well.
What node version you are using?
Found this issue.
https://github.com/vercel/next.js/issues/61995 (updated)
Just realized you need to run pnpm store prune to clean pnpm cache
Avatar
Cornish RexOP
What node version you are using?
@Siamese. 
update-next-app# node --version
v20.12.2
Avatar
Siamese
Image
I think it would be a good idea to downgrade next.js
and wait for things to get stable
Avatar
Cornish RexOP
@Siamese, I appreciate all your help.
Unfortunatelly, there's a [security vulnerability](https://nvd.nist.gov/vuln/detail/cve-2024-34351) in Next.js 13 and no fix but upgrading to version 14.
Avatar
Siamese
Is your codebase available on github?
Avatar
Cornish RexOP
@Siamese, not publicly. Its my company product.
Avatar
Siamese
Oh No problems. I can take a look in the codebase and try if you are able to share it with me somehow