@remix/run example hydration error

[trickreich]

Duplicates

• [X] I have searched the existing issues

Latest version

• [X] I have tested the latest version

Steps to reproduce 🕹

Link to live example: https://zzmiwwwmjgithub-uqcc--3000.local-credentialless.webcontainer.io/

Steps:

1. Open Console

Current behavior 😯

Expected behavior 🤔

No hydration error

Context 🔦

No response

Your environment 🌎

No response

[mnajdova]

Hi, did you follow the example project we provide?

[trickreich]

Yes, open your example in StackBlitz.. you will see the same errors..

[mnajdova]

I noticed now that the example is pretty much out of date, compared to the latest template that is being generated. We will need to update it.

[trickreich]

Sorry, I don't get it.. is there a working example somewhere? I would need it for a production app...

[techieyann]

Emotion does not support React 18's renderToPipeableStream yet. You either live with the hydration error or a noticeable flicker on initial load when the styles get applied.

[progital]

I can update the example project with this solution that fixes hydration errors. Have it implemented for a project of mine, works fine. Happy to submit a PR @mnajdova

[MartinRob13]

this worked for me: https://github.com/kiliman/remix-hydration-fix