Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Unstyled UI shows up on the first load. CSS is not loading properly on production build
See original GitHub issueDuplicates
- I have searched the existing issues
Latest version
- I have tested the latest version
Current behavior 😯
Unstyled UI shows up on the first load when using material ui examples nextjs-with-typescript or nextjs stackblitz
This also happens within my own project with the latest packages versions.
Expected behavior 🤔
Ui is loaded with styles on the first load.
Steps to reproduce 🕹
Steps:
- Go to https://stackblitz.com/github/mui/material-ui/tree/master/examples/nextjs or https://stackblitz.com/github/mui/material-ui/tree/master/examples/nextjs-with-typescript
- Reload the ui within stackblitz (it can be seen that mui light bulb icon is large for a fraction of a second)
Context 🔦
No response
Your environment 🌎
`npx @mui/envinfo`
Don't forget to mention which browser you used.
Output from `npx @mui/envinfo` goes here.
Issue Analytics
- State:
- Created a year ago
- Reactions:1
- Comments:7 (2 by maintainers)
Top Results From Across the Web
Material styling not loading in production build - Stack Overflow
When I build the project, the first page loads just fine but when I navigate to a second page, a lot of the...
Read more >Getting started - Bootstrap
Bootstrap. Compiled and minified CSS, JavaScript, and fonts. No docs or original source files are included. Download Bootstrap. Source code.
Read more >HTML table basics - Learn web development | MDN
A table is a structured set of data made up of rows and columns (tabular data). A table allows you to quickly and...
Read more >Issue 246875: Chrome not rendering webpage CSS and ...
Steps to reproduce the problem: 1. Load webpage. Everything renders ok. 2. Press F5 or refresh the page or click on a navigation...
Read more >CSS | single-spa - JS.ORG
In a microfrontends architecture, it's important to have both shared CSS and ... should be scoped so that class names do not collide...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
I upgraded from v12.0.10 to v12.1.7-canary.39 and I still have this issue happening, anybody can help?
@PupoSDC @balazsorban44 Thanks a lot for the quick response! Can confirm it works with the
next@12.1.7-canary.6.