v14.2 causing build error for Material UI Icons #64518
Description
Link to the code that reproduces this issue
https://github.com/lucasvieirasilva/nextjs-mui-issue1
To Reproduce
- Clone the https://github.com/lucasvieirasilva/nextjs-mui-issue1 repo
- Install the dependencies
npm install - Run build
npm run build
Current vs. Expected behavior
Currently, when there's any MUI Icon in the page the build command throws the following exception:
Error occurred prerendering page "/". Read more: https://nextjs.org/docs/messages/prerender-error
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.
at nM (/Users/lucasvieira/Projects/mui-issue1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:61599)
at nM (/Users/lucasvieira/Projects/mui-issue1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:61546)
at nN (/Users/lucasvieira/Projects/mui-issue1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:64546)
at nB (/Users/lucasvieira/Projects/mui-issue1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:67538)
at nD (/Users/lucasvieira/Projects/mui-issue1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:66680)
at nN (/Users/lucasvieira/Projects/mui-issue1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:64853)
at nB (/Users/lucasvieira/Projects/mui-issue1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:67538)
at nD (/Users/lucasvieira/Projects/mui-issue1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:66680)
at nN (/Users/lucasvieira/Projects/mui-issue1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:64853)
at nB (/Users/lucasvieira/Projects/mui-issue1/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:67538)
✓ Generating static pages (5/5)
> Export encountered errors on following paths:
/page: /
I've also tested only the MUI component (e.g. Grid) and the build works correctly, it only fails with MUI Icons (@mui/icons-material)
If the static pages don't have any MUI Icon and any dynamic route page has MUI Icons the build works fine, but the page crashes when you try to access the application.
Provide environment information
Operating System:
Platform: darwin
Arch: x64
Version: Darwin Kernel Version 23.4.0: Fri Mar 15 00:11:05 PDT 2024; root:xnu-10063.101.17~1/RELEASE_X86_64
Available memory (MB): 16384
Available CPU cores: 12
Binaries:
Node: 20.12.2
npm: 10.5.0
Yarn: 1.22.19
pnpm: 8.6.12
Relevant Packages:
next: 14.2.1-canary.5 // There is a newer canary version (14.3.0-canary.0) available, please upgrade!
eslint-config-next: 14.2.1
react: 18.2.0
react-dom: 18.2.0
typescript: 5.4.5
Next.js Config:
output: standaloneWhich area(s) are affected? (Select all that apply)
Not sure
Which stage(s) are affected? (Select all that apply)
next build (local)
Additional context
I've tested with the new v14.2.1-canary.5 version which is supposed to fix this issue, but apparently, it only fixes MUI components, not MUI icons.
Issue reference: #64369
I've tested with Next.js 14.1.4 and works fine.
The 14.2.1-canary.7 and 14.3.0-canary.0 versions are not working as well.