如何将 Bootstrap 变量导入 SASS 模块？答案

【问题标题】：How to import Bootstrap variables into SASS module?如何将 Bootstrap 变量导入 SASS 模块？
【发布时间】：2021-07-29 07:33:05
【问题描述】：

有没有办法在 SASS 模块中使用 Bootstrap SASS 变量？

例如，我的 react/NextJS 项目中有文件 index.module.scss。如何从引导程序中使用该 sass 模块变量？像这样的：

.hero{
    color: $blue-200;
}

如果我只是在文件开头添加这个导入：

@import '~bootstrap/scss/bootstrap.scss';

我收到了这个错误（来自 NextJS）：

让我注意，当我在非模块 sass 文件中使用这个导入时（比如说在文件 index.scss 中），它就可以工作了。但我需要（想要）使用 SASS 模块...

知道怎么解决吗？
谢谢！

【问题讨论】：

【解决方案1】：

哦，我找到了解决办法。我可以添加这三个导入（而不是一个引导导入）：

@import "~bootstrap/scss/functions";
@import "~bootstrap/scss/variables";
@import "~bootstrap/scss/mixins";

这三个导入一起工作并且不会导致错误...

【讨论】：