Geek Answers Handbook

React 16: Warning: The expected server-side HTML should contain the corresponding <div> in the <body>

Since upgrading to React 16, I get the following error message:

warning.js:33 Warning: Expected server HTML to contain a matching <div> in <body>.

What usually causes this error message and how can it be fixed?

+19
reactjs
source share
4 answers

If you use ReactDOM.hydrate to launch a web application, you will see this warning.

If your application does not use server-side rendering ( ssr ), use ReactDOM.render to run.

+16
source share

If your HTML is similar

 <table> <tr>

You may get this error.
To get around this, use the <tbody> tag as

 <table> <tbody> <tr>

Remember to close the tag (s)!

+1
source share

I assume you are using SSR. A warning about trying to render before the window object appears. You need to moisturize.

 ReactDOM.hydrate(<App />, document.getElementById("home"))

What I don’t understand is that the App component is served by an express service. Why is he trying to render before being served? Bring comments.

0
source share

It is like Browsersync inserts a script tag into a body on the client side, which is not on the server side. Therefore, React cannot connect to the server rendering.

-one
source share

More articles:


All Articles