Если вы прочтете первый пост, то поймете, что я решил отказаться от CSS-файлов в этом проекте. Будет весело, и я уже столкнулся со своей первой болевой точкой.

Для каждого компонента у меня есть соответствующий файл, содержащий все стили. Это будет шаблоном для всего сайта. Все является компонентом. Каждый компонент имеет свои собственные стили.

Фактический стиль работает нормально. И без этапа компиляции SASS можно избежать большого беспорядка с веб-пакетом.

CSS как JS на самом деле не имеет большой разницы. То, что было бы переменной SASS, — это просто переменная JavaScript (обратите внимание на цвет фона). То, что могло бы быть примесью, — это просто функция JavaScript (обратите внимание на тень).

Проблема

Я не получаю замену модуля в горячем режиме (HMR) при смене стиля. Мне нужно обновить страницу, как чертову пещерному человеку!

Я предполагаю, что это потому, что webpack не знает, что компонент изменился. Возможно, однажды я перейду к коду HMR и разберусь с этим, но пока…

Решение

Я помещу стили в тот же файл. Вы знаете что это значит?

HTML, JavaScript и CSS в одном файле.

Вперед!