Можно ли глобально импортировать миксины scss в create react app?
Подскажите пожалуйста, можно ли как-нибудь глобально импортировать библиотеку с миксинами или переменными в приложение create react app НЕ прибегая к eject?
Допустим у меня есть сетка, пусть это будет препроцессорная сетка Bootstrap которая дает миксины для генерации элементов сетки – контейнеров, рядов и колонок, то есть вот так:
.myContainer {
@include make-container();
@include make-container-max-widths();
}
.myRow {
@include make-row();
}
.myCol {
background-color: yellow;
@include make-col-ready();
@include make-col(4);
@include media-breakpoint-down(sm) {
@include make-col(6);
}
@include media-breakpoint-down(lg) {
@include make-col(12);
}
}
Я использую css module для стилей в react и мне хотелось бы иметь доступ к этим миксином в каждом css модуле – не могу найти нормальное решение.
Сейчас делаю так – просто в каждом модуле импортирую эти миксины в самом верху css модуля
@import "./grid/index.scss";
И тогда миксины работают внутри модуля.
Ну, во-первых, это не очень удобно, постоянно импортировать один и тот же файл в модуль – ну это ладно, ерунда.
Но, во-вторых, в таком случае все код этих миксинов дублируется в каждый из css модулей, правда это только в dev режиме, в build код чистый, но все равно – миксины подтягивают кучу стандартного css из библиотеки и вставляют его в каждый и это как-то коробит. Не ужели нет нормального решения такой задачи?
Хотелось бы один раз указать что нужно импортировать и просто использовать миксины в тех css модулях где это необходимо.