У меня есть приложение create-реагировать с файлами стилей S CSS. Есть App.scss, где я включаю все .scss таблицы стилей и variables.scss, где я отклоняю все переменные проекта.
Когда я импортирую variables.scss в App.scss и затем импортирую все файлы стилей компонентов Я получаю ошибку SassError: Undefined variable: $grey, которую я использую в border-bottom: 1px solid $grey в файле Header.scss.
Если я импортирую variables.scss в Header.scss, ошибка исчезнет, и все будет работать правильно. Но я не хочу включать переменные в каждый файл .scss компонента.
Что я должен сделать, чтобы использовать переменные variables.scss во всех моих файлах проекта?
Что я пробовал:
- переименовать
variables.scss в _variables.scss и импортировать как @import 'components/variables'; - , импортировать
variables.scss до других импортов в App.scss - импорт
variables.scss в index.scss напрямую - поиск ответа здесь (ничего не помогло)
variables.s css
$grey: #fefefe;
$black: #000000;
App.s css
@import 'components/variables';
@import 'components/header/Header.scss';
структура проекта снимок экрана