Поддержка на стороне сервера CSS-модулей

Question

Я собираюсь импортировать стили с CSS-модулем и заставить его работать с рендерингом на стороне сервера. Я пробовал следующие методы, но у каждого есть своя оговорка. Каков наилучший способ для require('.style.scss'), если есть какие-либо побочные эффекты?

1. Использование css-modules-require-hook:

   Преимущество: Простота настройки. Вам просто нужно вызвать hook в начале кода сервера. Вам не нужно изменять компоненты.

   Caveat: Он изменяет require.extensions глобальный объект, который является устаревшим.

2. Использование isomorphic-style-loader:

   Advantage: Нет больше крючков для require.extensions.

   Caveat: Обертывание компоненты с HOCs, которые используют Реагировать Context, который является экспериментальным API и, скорее всего, перерыв в будущих версиях React.

3. Использование webpack-isomorphic-tools:

   Advantage: Нет зависимостей от require.extensions или Context (AFAIK).

   Caveat: Обертка сервера внутри экземпляра webpack-изоморфного инструмента. И можем ли мы избавиться от webpack-assets.json?

4. Пакетирующие сервер с WebPack:

   Преимущество: Нет больше крючков или инъекций.

   Caveat: В разработке, очень громоздок, чтобы связать все, когда изменения коды и даже делают его труднее для отладки в большом комплектных .js файла. Не уверен - вам может понадобиться передать комплект .js для тестирования бегуна.

Отказ от ответственности:

• Преимущества и предостережения ниже просто мои два цента, и на самом деле я люблю все библиотеки, плагины и подходы, которые они приняли, чтобы решить эту проблему и реально оценить свои усилия ,
• Я не являюсь носителем английского языка, пожалуйста, исправьте меня, если я искажу себя.

Answer 1

В конце концов, я решил подключить require.extensions к разработке.Вероятно, это не самый лучший способ, отображая предупреждающие сообщения на консоли, такие как несоответствие контрольной суммы, но в режиме разработки я могу игнорировать это.