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.
React reuse markup (server rendering) issues
See original GitHub issueReceiving this warning
Warning: React attempted to reuse markup in a container but the checksum was invalid. This generally means that you are using server rendering and the markup generated on the server was not what the client was expecting. React injected new markup to compensate which works but you have lost many of the benefits of server rendering. Instead, figure out why the markup being generated is different on the client or server:
(client) iv></div></div><div data-reactid="17"></
(server) iv></div></div><div class="EyeW-App-root
Issue Analytics
- State:
- Created 7 years ago
- Comments:7
Top Results From Across the Web
Warning: React attempted to reuse markup in a container but ...
WARNING The popular answer here is not correct. What it is doing is removing the existing DOM entirely, and replacing it with a...
Read more >React attempted to reuse markup in a container but ... - GitHub
Warning: React attempted to reuse markup in a container but the checksum was invalid. This generally means that you are using server rendering...
Read more >React v18.0 – React Blog
Concurrent rendering is a powerful new tool in React and most of our new features are built to take advantage of it, including...
Read more >Fixing: “React attempted to reuse markup in a container but ...
Apparently this error is caused by webkit and Node rendering the ordering of values in an object differently. The easiest way to fix...
Read more >React Best Practices – Tips for Writing Better React Code in ...
Another root cause for problems React devs have is a poor basic ... Side Rendering) and SSR (Server Side Rendering) in general and...
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
Ok as i found the problem is i am using mediaquery of react -responsive. If you know, is there any suggested to pass device width from serverside?
Any workaround or similar example? Sorry but i do not understand well what you mean? Do need make changes on component?