Mui Custom Theme error
Answered
Gazami crab posted this in #help-forum
Gazami crabOP
I am trying to implement a custom mui theme in my nextjs app but it gives the following error-
- error node_modules\next\dist\build\webpack\loaders\next-flight-loader\module-proxy.js (153:22) @ Object.defineProperties.$$typeof.value
- error Error: Attempted to call createTheme() from the server but createTheme is on the client. It's not possible to invoke a client function from the server, it can only be rendered as a Component or passed to props of a Client Component.
Is there any possibility that I can use createTheme() and still render that component on server side??
- error node_modules\next\dist\build\webpack\loaders\next-flight-loader\module-proxy.js (153:22) @ Object.defineProperties.$$typeof.value
- error Error: Attempted to call createTheme() from the server but createTheme is on the client. It's not possible to invoke a client function from the server, it can only be rendered as a Component or passed to props of a Client Component.
Is there any possibility that I can use createTheme() and still render that component on server side??
Answered by fuma
try creating a
export your theme from
theme.ts file and add "use client" to the fileexport your theme from
theme.ts, pass it to ThemeProvider10 Replies
try creating a
export your theme from
theme.ts file and add "use client" to the fileexport your theme from
theme.ts, pass it to ThemeProviderAnswer
You can't invoke a client function from a server component, but you are able to pass a client object to a client component (the theme provider)
@fuma try creating a `theme.ts` file and add "use client" to the file
export your theme from `theme.ts`, pass it to ThemeProvider
Gazami crabOP
With this will I be able to render other components using my custom theme on server side?
Gazami crabOP
This worked!!!!
Thanks alot @fuma
â¤ï¸
btw if your problem has been solved, you can mark the answer as solution 