Задать вопрос
@lookingfor2

Как добавить before для компонента react в css?

Css файл импортирую в компонент, картинку поместил в public, она выше по иерархии на несколько папок. Где то прочитал что нужно просто в content:"" указать имя файла, но тогда ошибка Error: Module not found: Can't resolve './maps-location.jpg'
  • Вопрос задан
  • 362 просмотра
Подписаться 1 Простой Комментировать
Решения вопроса 1
search
@search
мама говорит что я особенный
Можно картинку поместить в ту же папку где и CSS файл. Тогда в CSSнике можно будет сделать url('./image.jpg'), а вебпак это дело разрулит во время компиляции и поместит картинку куда надо.

Если вы пришли в Реакт и модульные бандлеры (ака Вебпак) со старого доброго Галпа или вообще без него обходились раньше, то такой подход немного ломает стереотип. Мы привыкли хранить картинки в папке public/images, а стили в папке public/styles. Но в мире вебпака совершенно нормально хранить стили и статитику рядом с кодом. Собственно, вебпак и нужен для того чтоб это подключать и распределять как нужно.

В последнее время стал популярен подход так называемого Модульного ЦСС (CSSModules): это когда стили и статические файлы относящиеся к компоненту хранятся в папке компонента. Сам Вебпак позаботится о том чтоб во время компиляции положить стили и статику куда нужно. За это мы его и любим.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Wanted. Санкт-Петербург
До 300 000 ₽
Grow Media Москва
от 150 000 до 200 000 ₽
12 дек. 2024, в 19:06
45000 руб./за проект
12 дек. 2024, в 18:46
4000 руб./за проект