Issue - Calendar component app crash on vercel

[KundwaBruno]

NextUI Version

2.4.6

Describe the bug

I recently upgraded to nextui version 2.4.6 in order for me to use the perfect DatePicker and Calendar components. Howver once i run the app locally, it runs fine without any BUGS, but on vercel the app crashes and in the logs it displays the error below.

Tried using vercel's node version and the build was still running fine without errors.

Error: Cannot find package '/var/task/node_modules/@react-aria/calendar/node_modules/@react-stately/utils/package.json' imported from /var/task/node_modules/@react-aria/calendar/node_modules/@react-aria/utils/dist/import.mjs
Did you mean to import "@react-stately/utils/dist/main.js"?
    at legacyMainResolve (node:internal/modules/esm/resolve:219:26)
    at packageResolve (node:internal/modules/esm/resolve:845:14)
    at moduleResolve (node:internal/modules/esm/resolve:931:18)
    at moduleResolveWithNodePath (node:internal/modules/esm/resolve:1173:14)
    at defaultResolve (node:internal/modules/esm/resolve:1216:79)
    at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:383:12)
    at ModuleLoader.resolve (node:internal/modules/esm/loader:352:25)
    at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:227:38)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:87:39)
    at link (node:internal/modules/esm/module_job:86:36) {
  code: 'ERR_MODULE_NOT_FOUND',
  page: '/'
}

Local node version: 22.2.0 Vercel node version: 20.x

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

The Issue comes on vercel only

Expected behavior

Should run without the app crashing

Screenshots or Videos

No response

Operating System Version

MacOs

Browser

Chrome

[linear[bot]]

ENG-1206 [BUG] - Calendar component app crash on vercel

[awesome-pro]

Seems like this issue on NextJs

kindly follow these steps -

1. Try to resolve all warnings
2. Run npm run lint on the local environment, and check for errors
3. Set env variable CI = false and run npm ci --include=dev, CI = true considers warnings as errors

See if the error stills persists. @KundwaBruno Kindly follow the above steps and confirm again

[KundwaBruno]

@abhinandan-verma Thanks for the quick response,

FYI the build is passing fine both locally and remotely, only the app crashes remotely with the error above and locally the app runs perfect.

1. I have cleared all errors and warnings, currentlynpm run lint shows no errors or warnings
2. Which environment should i run npm ci --include=dev because locally the app runs fine until i push it to vercel.

[awesome-pro]

@KundwaBruno you should run it remotely, observe the changes (if any). Confirm if you still have the issue.

[KundwaBruno]

Okay, kindly guide me where to add this @abhinandan-verma

[awesome-pro]

@KundwaBruno for your help, I deployed a test app with Calendar component on Vercel, and deployment was successful. Maybe you are having some configuration or dependency conflict issue. here is app and repo link repo app

I will recommend, compare the configurations with your own app with mine one , update your dependencies. Hopefully you should get your issue resolved.

[awesome-pro]

@KundwaBruno are you still facing the same issue? did you compare the configuration and dependencies?

Kindly confirm

[KundwaBruno]

Now i just got another one after i updated my dependency version to the ones in your repo.

⨯ Error: Cannot find package '/var/task/node_modules/@nextui-org/slider/node_modules/@react-aria/ssr/package.json' imported from /var/task/node_modules/@nextui-org/slider/node_modules/@react-aria/i18n/dist/useDefaultLocale.mjs
Did you mean to import "@react-aria/ssr/dist/main.js"?
    at legacyMainResolve (node:internal/modules/esm/resolve:219:26)
    at packageResolve (node:internal/modules/esm/resolve:845:14)
    at moduleResolve (node:internal/modules/esm/resolve:931:18)
    at moduleResolveWithNodePath (node:internal/modules/esm/resolve:1173:14)
    at defaultResolve (node:internal/modules/esm/resolve:1216:79)
    at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:383:12)
    at ModuleLoader.resolve (node:internal/modules/esm/loader:352:25)
    at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:227:38)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:87:39)
    at link (node:internal/modules/esm/module_job:86:36) {
  code: 'ERR_MODULE_NOT_FOUND',
  page: '/'
}

I'm use the pages router tho

@abhinandan-verma

[KundwaBruno]

@abhinandan-verma You still there?

[wingkwong]

@KundwaBruno please share a minimal reproducible environment.

[KundwaBruno]

@wingkwong I reverted back to version 2.4.10 of nextui/react and it worked, not sure if it's issue within next-ui itself

[wingkwong]

Closing - not able to reproduce.

[hmbrg]

I'm having the exact same issue, also just on Vercel and while using Pages router.

[notrealradical]

Having the same issue with Vercel and Remix

[syskin]

I faced the same issue with the following stack :

• Nextjs 14.2.14
• @nextui-org/react 2.4.8

Local and remote build works correctly, no any warn or errors. I'm using the page router.

I don't use the Calendar component in my project.

It causes my app crashes on Vercel :

⨯ Error: Cannot find package '/var/task/node_modules/@nextui-org/calendar/node_modules/@react-aria/i18n/node_modules/@react-stately/utils/index.js' imported from /var/task/node_modules/@nextui-org/calendar/node_modules/@react-aria/i18n/node_modules/@react-aria/utils/dist/import.mjs Did you mean to import "@react-stately/utils/dist/main.js"? at legacyMainResolve (node:internal/modules/esm/resolve:219:26) at packageResolve (node:internal/modules/esm/resolve:845:14) at moduleResolve (node:internal/modules/esm/resolve:931:18) at moduleResolveWithNodePath (node:internal/modules/esm/resolve:1173:14) at defaultResolve (node:internal/modules/esm/resolve:1216:79) at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:540:12) at ModuleLoader.resolve (node:internal/modules/esm/loader:509:25) at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:239:38) at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:96:40) at link (node:internal/modules/esm/module_job:95:36) { code: 'ERR_MODULE_NOT_FOUND', page: '/features' }
Oct 06 09:42:47.73
GET
Node.js process exited with exit status: 1. The logs above can help with debugging the issue.

I have the same behaviour for date-picker component :

⨯ Error: Cannot find package '/var/task/node_modules/@nextui-org/date-picker/node_modules/@react-aria/i18n/node_modules/@react-stately/utils/index.js' imported from /var/task/node_modules/@nextui-org/date-picker/node_modules/@react-aria/i18n/node_modules/@react-aria/utils/dist/import.mjs

I downgraded @nextui-org/react to 2.3.6, and everything works as expected.