Начал изучение реакта сегодня накопилось пару вопросов 1.СSS модуль это

когда к названию мы добавляем .module что добавляет ему уникальный айди при компиляции для инкапсуляции между другими компонентами?
2. если я поставлю модуль на САСС для реакта и буду подключать сасс напрямую в jsx при компиляции он свернёт его в css пропущенный через sass? и используют же сасс в комбинации с реактом?
3.Правильное решение как я понял строить иерархию проекта по папкам к каждому компоненту, но как тогда правильно поступать с ассетамм? делать папку на уровне с компонентами общую для всех? или делать папку ассетов внутри каждого задецствующего компонента
4.create react app хватает почти для всего кроме предпроцессов или есть ещё какие то нужные модули?

Css-модули обрабатываются сборщиком и да, для стилей генерируются специальные уникальные идентификаторы для инкапсуляции Можно использовать module.sass create-react-app поддерживает sass и sass модули

1. Давно не видел, чтобы пользовались на проектах, могу предположить, что выходит из моды) 2. Да, используют. Достаточно посавить node-sass и переименовать index.css в index.scss; 3. Это уже на практике поймешь как тебе лучше; Но есть очень много статей про это типа Atomic и т.д.; 4. Там все есть sass модули поддерживает и много чего еще, но важно понимать как работает webpack. Если нужны доп.плагины, есть инструменты типа craco.

Ну я как-то один конфижел с нуля прям, так что вроде базовое понимание вебпака есть, я просто о том что редко с коробки кладут всё нужное ибо предвидеть все ситуации скорее всего невозможно, но может есть ещё какие-то актуальые модули про которые не слышал

Тогда супер ласт вопрос к тебе же, если ссс модули отходят на второй план, я слышал что вроде при них можно игнорировать бэм (хз насколько норм практика), а без них уже точно не получится. В принципе при любых раскаладах стоит придерживаться реакт-бэм? (вопрос может быть глупый с таким мнением просто тоже сталкивался)

ну вообще styled-components глянь, это очень мощная вещь

это вообще топ

Когда начнёт лагать. Побежишь на цсс переписывать

css модули вполне актуальны. Вот бэм в реакте мне кажется, плохая практика. Так как большинство проблем, которые она решает, можно решить другими, более простыми способами. Достаточно просто иметь общий набор правил именования классов внутри команды. А модули встречаются реже, потому что сейчас популярен подход css in js, теже стайлед компонентс, эмошн. Посмотри в эту сторону тоже, скорее всего придется столкнуться в работе

он лагает? Не знал

ну если выберешь убогую библиотеку, то может и будет лагать а так-то чего?

надо понимать, где их применять. любой инструмент испортится в неумелых руках

Смысле. Там рантайм. Там твои пропсы и пересчёт стилей Не понимаю почему вы ещё не знаете

styled components - это не только название конкретной библиотеки. это подход. есть варианты без рантайма

я теперь окончательно запутался стайлед компонентс и стайл модулс это взаимоисключающие технологии? Как я понял надо рассмотреть обе но к стайл компанентс открыть когда уже всё прйоду

Это название конкретной библиотеки Cssinjs подход Не

философский вопрос :) но в принципе так тоже верно просто очень многие говорят "мы юзаем стайледы", а на самом деле внутри astroturf :)

css-модули - это не стайлед компонентс, этот способ изоляции обычного цсс

я не в курсе что за стайл модулсб но если говорить о css-in-js и css modules, это разные подходы, да.

я не так выразился ибо сонный я имел ввиду css modules , сори

хотя тот же astroturf реализует styled components через цсс-модули :)

интересно

Если cssinjs можно сделать без рантайма, почему популярные либы делают это в рантайме? Это же позиционируется, как их главный минус 🤔

потому что с рантаймом ты можешь больше. но на самом деле не всем это надо

Было бы интересно об этом почитать, если завалялась статейка какая, буду благодарен)

не... статейки нет, только собственный опыт ну грубо говоря без рантайма ты не сможешь сделать "цвет бекграунда любой какой передали" или паддинг или еще что-то. ты можешь только работать в пределах фиксированных наборов: например паддинги small/medium/large

Понял