@ilanagrk
front-end developer

Как перенести стили?

Дано: проект на PHP, которому уже несколько лет. Все стили в двух огромных файлах. Было решено переписать на React. Переписывать начали, а стили складываются все в те же два файла.
Вопрос: как можно более менее безболезненно перенести стили в реакт репозиторий, так, что бы кусок проекта, который ещё на PHP не поломать, не задваивать стили и т.д.
  • Вопрос задан
  • 207 просмотров
Пригласить эксперта
Ответы на вопрос 3
profesor08
@profesor08 Куратор тега CSS
Переписывать начали, а стили складываются все в те же два файла.

Уже на этом этапе что-то пошло не так.

Раз начали переписывать, ну так переписывайте. Как писать стили к компонентам реакта думаю известно. Если это не подходит, то думаю известно как подключить scss со стилями к проекту.
Ответ написан
@camelCaseVlad
Инкапсулируйте стили с компонентами. Не выносите все стили в общий .css файл, придерживайтесь best practices (гуглите, используйте, которые подходят именно вам).

Вот пример из моего проекта на работе:
5defad3c18cb0983470486.png
Ответ написан
locky_yotun
@locky_yotun
Я видел некоторый джаваскрипт
Допустим у вас есть текущий файл all-old-styles.css и 2 новых компонента Header.jsx и Footer.jsx. Стили новых компонентов лежат, допустим, рядом с самими компонентами — в файлах Header.scss и Footer.scss.
Старый файл переписываете так, чтобы он собирался их кусков старых стилей и новых — то есть создаете файл all-old-styles.scss, и чтобы на выходе получался все тот же all-old-styles.css:

/* Old styles */
@import 'old-styles.scss';

/* New styles */
@import 'components/Header/Header.scss';
@import 'components/Footer/Footer.scss';
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
19 февр. 2020, в 02:24
500 руб./за проект
18 февр. 2020, в 23:53
8000 руб./за проект