Рендеринг на стороне сервера ReactJS.NET и Webpack со стилями

Я пытаюсь отобразить компонент на стороне сервера для начальной загрузки страницы. Разметка отлично отображается с помощью @Html.React("componentName", props). Проблема, с которой я сталкиваюсь, заключается в том, что компонент будет отображаться без стиля. Мгновением позже стили загружаются через пакет Webpack и обычный загрузчик стилей.

Я попробовал пару подходов.

  1. https://github.com/thereactivestack/style-collector-loader не работает, потому что Я получаю сообщение об ошибке, говорящее, что глобальное значение не определено.

  2. https://github.com/kriasoft/isomorphic-style-loader не работает для та же причина

В идеале я хотел бы получить требуемый CSS от компонентов и отобразить их в виде бритвы.

Я пытаюсь исправить ошибку в существующем проекте. Webpack и react для меня относительно новые концепции, поэтому я не совсем уверен, какую информацию мне следует предоставить. Дайте мне знать, какие дополнительные детали помогут.


person Chris Peterson    schedule 15.06.2016    source источник


Ответы (1)


Вы должны вызывать require('your css file') в функции componentDidMount при попытке использовать рендеринг на стороне сервера.

для получения дополнительной информации: https://github.com/webpack/react-starter/issues/37

person Ehsan    schedule 19.10.2016