FOUC when used with Next.js 10 and React 17 #681
Description
Do you want to request a feature or report a bug?
I wish to report a bug.
What is the current behavior?
When I used styled-jsx with Next.js 10 and React 17, there seems to be an unavoidable FOUC when visiting my portfolio website for the first time:
It seems to be working fine with Next.js 9 and React 16. It's also definitely a bug with styled-jsx as those same styles were able to be loaded using SCSS modules in my TB project.
See this issue for more info.
If the current behavior is a bug, please provide the steps to reproduce and possibly a minimal demo or testcase in the form of a Next.js app, CodeSandbox URL or similar
Steps to reproduce the behavior, please provide code snippets or a repository:
- Go to https://nicholaschiang.com.
- See FOUC.
Or, if you want to reproduce locally:
- Clone this repository.
- Follow these instructions to install deps, etc.
- Run
yarn devoryarn build && yarn start - Open up http://localhost:3000.
- See FOUC.
What is the expected behavior?
There should be no FOUC.
Environment (include versions)
- OS: PopOS 20.10
- Browser (if applies) Firefox
- Version of Next.js: 10.0.1
- Version of React.js: 17.0.1
- Version of Node.js: 12.18.3
- Version of StyledJSX: 3.3.0
Did this work in previous versions?
Yes, it worked fine with previous version of Next.js and React.