Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Global styles in _document.js not loading on first render #2210

andrewwong97 opened this issue Jun 9, 2017 · 3 comments


Copy link

commented Jun 9, 2017

When I first load the site using yarn dev or npm run dev, all styles except the global ones defined in _document.js (layout) load well.

After refreshing the webpage, the _document.js styles load fine.

Snippet from my package.json:
"dependencies": {
"next": "^2.4.0",
"react": "^15.5.4",
"styled-jsx": "^0.5.7"

Has anyone else encountered this issue? Is there a way to load these global layout styles first?


This comment has been minimized.

Copy link

commented Jun 9, 2017

@andrewwong97 Are you using <style jsx global> in _document.js? That's what causing the issue. You can just use a normal <style> tag in this case.


This comment has been minimized.

Copy link

commented Jun 9, 2017

Will try, thanks!


This comment has been minimized.

Copy link

commented Jun 10, 2017

@andrewwong97 also remove styled-jsx from your package.json. Next will use the one inside it.

@lock lock bot locked as resolved and limited conversation to collaborators May 11, 2018

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
None yet
3 participants
You can’t perform that action at this time.