[material-ui][examples] Custom fonts not changing during the initial rendering
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 99.1k
- Forks
- 32.5k
- Avg merge
- 2d 17h
- Merged PRs (30d)
- 106
Description
I'm facing an issue with the fonts in my Next.js 14 project with MUIv5 n TypeScript.
I've used the following code to import and set up fonts...,
but the fonts are not changing during the initial rendering. However, after the initial rendering, the fonts switch to the customized ones. All other MUI styles are working fine. I followed this (' https://github.com/mui/material-ui/blob/master/examples/material-ui-nextjs-ts/src/components/ThemeRegistry/theme.ts ') for the setup. Can you help me identify what might be causing this font issue..??
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the ThemeRegistry/theme.ts example linked in the issue and reproduce the behavior in a Next.js 14 TypeScript app during the initial render. Compare the server-rendered and post-render font setup, then identify the cause and document a reproducible resolution for the custom fonts loading consistently.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- next.js, react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 20/100