React 16: Warning: Ожидаемый серверный HTML-код должен содержать соответствующий <div> в <body>

С момента обновления до React 16 я получаю следующее сообщение об ошибке:

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

Что обычно вызывает это сообщение об ошибке и как оно может быть исправлено?

Ответы

Ответ 1

Если вы используете ReactDOM.hydrate для запуска веб-приложения, вы увидите это предупреждение.

Если ваше приложение не использует рендеринг на стороне сервера (ssr), используйте ReactDOM.render для запуска.

Ответ 2

Если ваш HTML-код похож

<table>
  <tr>

Вы можете получить эту ошибку.
Чтобы обойти это, используйте тег <tbody> как

<table>
  <tbody>
    <tr>

Не забудьте закрыть тег (ы)!

Ответ 3

Я предполагаю, что вы используете SSR. Предупреждение о попытке выполнить рендеринг до появления объекта окна. Вам нужно увлажнять.

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

Чего я не понимаю, так это того, что компонент App обслуживается экспресс-службой. Почему он пытается отрендерить, прежде чем его подают? Принесите комментарии.

Ответ 4

Это похоже на то, что Browsersync вставляет тег script в тело на стороне клиента, которого нет на стороне сервера. Таким образом, React не может подключиться к рендерингу сервера.