Bootstrap-Sass: 使用另一个变量覆盖变量

Bootstrap-Sass: Overriting Variables with using other Variable

我正在为我的一个项目使用 Bootstrap-sass,我想使用 Sass 变量(当然)对其进行自定义。

我创建了一个名为“_variables.scss”的新 .scss 文件,并在 bootstrap-sass 文件之前将其导入到我的主 .scss 文件中。它工作正常,直到我达到一点:

如果我想在我的自定义中使用 bootstrap-sass 变量,它显然表明该变量是未知的(因为它是稍后导入的)。但如果我想以正确的方式更改某些变量,这是不可避免的,例如:

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

如果我只想将 940px 的 "fixed" 值更改为某些值,但我仍想在我的定义中使用 $grid-gutter-width 变量,我会收到上面解释的错误。

有什么办法可以做到这一点吗?

我见过的唯一解决方案是声明您所依赖的变量。因此,在 bootstrap-sass 的 _variables.scss 中,您找到行 $grid-gutter-width: 30px !default; 并在您自己的文件中使用它,如下所示:

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

正如您想象的那样,仅仅复制这样的信息是不幸的,尤其是如果您最终不得不复制多个变量定义只是为了声明您真正想要的 一个。如果有人有更 "DRY".

的解决方案,我也会非常感兴趣