Bootstrap-Sass: переопределение переменных с использованием другой переменной

Question

Я использую Bootstrap-sass для одного из моих проектов, и я хотел бы настроить его с помощью переменных Sass (конечно).

Я создал новый файл.scss с именем "_variables.scss" и импортировал его в свой основной файл.scss ДО файла bootstrap-sass. Это работает нормально, пока я не достигну одной точки:

Если я хочу использовать переменные bootstrap-sass в своей настройке, это, очевидно, говорит о том, что переменная неизвестна (потому что она импортируется позже). Но это неизбежно, если я хочу корректно изменить некоторые переменные, например:

$container-desktop: (940px + $grid-gutter-width);

Если я хочу изменить только "фиксированное" значение 940 пикселей на что-то, но я все еще хочу использовать $grid-gutter-width Переменная в моем определении я получаю эту ошибку, я объяснил выше.

Любые идеи, как я могу это сделать?

Answer 1

Единственное решение, которое я видел, это объявить переменные, от которых вы зависите. Итак, в бутстрапе-сасе _variables.scss, вы найдете строку $grid-gutter-width: 30px !default; и используйте его в своем файле так:

$grid-gutter-width: 30px;
$container-desktop: (940px + $grid-gutter-width);

Пока вы воображаете, к сожалению, просто скопировать такую ​​информацию, особенно если вам в конечном итоге придется скопировать несколько определений переменных, чтобы объявить то, что вам действительно нужно. Мне тоже было бы очень интересно, если у кого-то есть решение, которое более "СУХОЕ".