Фон
У меня есть приложение, отображаемое на стороне сервера, и разделение кода выполняется с помощью react-loadable
С помощью react-loadable 's webpack plugin , Я могу знать, какие чанки необходимы для страницы, и впоследствии могу отправить их вместе со средой выполнения веб-пакета в html.
Пример:
<script async src="chunk/by/react-loadable/chunk.js"></script>
<script async src="webpack/runtime.js"></script>
<script async src="webpack/entry.js"></script>
Задача
Проблема в том, что иногда среда выполнения webpack может быть загружена быстрее, чем чанк, и webpack затем будет запрашивать чанк через jsonp.
Это вызывает Reactвызвать ошибку гидратации.
Вопрос
Есть ли способ для webpack для чанка, если чанк в настоящее время включен в html, отображаемый сервером?
Есть ли способ перезаписать загрузчик webpack jsonp, чтобы он вел себя аналогично Next.js page-loader?т. е. загрузчик проверяет, существует ли в DOM тег сценария, прежде чем запрашивать его
Примечание:
Я знаю, что могу решить эту проблему, используя defer или просто удаливатрибут async, но мне было интересно, смогу ли я добиться такого поведения в webpack?