Npm 引导4如何覆盖用于定义其他默认变量的scss变量

首先，我想提一提这个问题：，似乎有人问过同样的问题，但没有有效的答案，所以我想我会用一个非常具体的例子再次提问

我基本上想覆盖Bootstrap4的一些默认变量。在下面的示例中，我想覆盖

$font size base

。我遵循了引导文档中推荐的方法，但它似乎只起到了部分作用。引导的默认变量（在

\u variables.scss

中）重用其他定义的变量。例如：

$input btn font size:$font size base！违约。但是，使用下面的方法更改
$font size base
时，它不会影响
$input btn font size

@import“节点/模块/引导/scss/函数”；
@导入“节点模块/引导程序/scss/变量”；
$font size基本值：0.9rem；
$secondary:$gray-400；
@导入“节点单元模块/引导程序/scss/引导程序”；

另一方面，如果我使用下一种方法，稍后导入变量，那么我确实会得到所需的结果，其中依赖于
$font size base
的所有变量也会发生更改。但是，这不是推荐的方法，当您想要定义依赖于默认变量的变量时，这一点就变得很清楚了。参见
$secondary:$gray-400$gray-400
未知，则会引发编译错误

@import“节点/模块/引导/scss/函数”；
$font size基本值：0.9rem；
$secondary:$gray-400；
@导入“节点模块/引导程序/scss/变量”；
@导入“节点单元模块/引导程序/scss/引导程序”；

这里推荐的解决方案是什么？
分离覆盖变量

导入
/variables
后需要执行的唯一覆盖是引用变量的覆盖（即：
$secondary:$gray-400；
）

如果您只想覆盖一个不引用另一个变量（即：
$font size base:2.9rem；
）的变量，该变量将位于导入变量之前

/* simple overrides */
$font-size-base: 2.9rem;

@import "bootstrap/functions";
@import "bootstrap/variables";

/* var dependent overrides */
$theme-colors: (
  secondary: $gray-400
);

@import "bootstrap";


注意：若要覆盖主题颜色，如
次要
，您必须更新主题颜色映射。
我考虑过这个选项，但后来我想：“如果我的
$font size base
引用了不同的变量，那么它将不起作用。因此，我肯定缺少了一些东西。”我想我不应该让它变得比需要的更复杂。通常基础变量不依赖于其他变量。