search

scalable-react / scalable-react-typescript-boilerplate

:star: Scalable micro-framework featuring React and TypeScript
https://scalable-react-ts-boilerplate.herokuapp.com/
MIT License
173 stars 26 forks source link

Fix FOUC server rendered Styled-components #16

Open RyanCCollins opened 7 years ago

RyanCCollins commented 7 years ago

I am not sure why, but the server-rendering of styled-components seems to fail. This is working on scalable-react-boilerplate (located here). It must be a regression in styled-components.

sfleck commented 7 years ago

What makes you think this is failing? I see the raw HTML using "View page source" when running the Production server. Is there a specific page/component that you are looking at?

I agree there is no server side rendering in the dev environment.

RyanCCollins commented 7 years ago

When you transition to a new route whose bundle is not yet loaded on the prod site, you will see a flash of unstyled content. I have it configured to inject the styles from the site into the head, but for some reason it misses it on the initial server-render.

I will post a link to the production site. Just a moment.

EDIT: it looks like this is only happening on full reload now because we are using react-router behind the scenes for page transitions.