`darken($color, $amount)` 的参数 `$color` 必须是颜色 Bootstrap 4 Angular 6

Question

尝试在我的 Angular 6 应用程序中点菜使用 Bootstrap 4，就像在我的 angular.json 文件中一样......

"styles": [
              "node_modules/bootstrap/scss/_functions.scss",
              "node_modules/bootstrap/scss/_variables.scss",
              "node_modules/bootstrap/scss/_mixins.scss",
              "src/styles.scss"
            ] 

在进行 sass 加载尝试后，会在终端中产生此错误...

./node_modules/bootstrap/scss/_variables.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js?? ref--15-3!./node_modules/bootstrap/scss/_variables.scss) 模块构建失败（来自 ./node_modules/sass-loader/lib/loader.js）：

未定义^论证$color的darken($color, $amount)必须是一种颜色

这是 _variables.scss 中有问题的行： $link-hover-color: darken($link-color, 15%) !default;

上面两行声明： $link-color: theme-color("primary") !default;

我在这里查看了许多可能的解决方案，但他们中的大多数人都说将函数放在已经完成的 vars 之前，但错误仍然存​​在。

非常感谢任何帮助。

Answer 1

我碰到了这个问题。所需要的只是在我的其他导入之前导入函数：

@import '../../node_modules/bootstrap/scss/functions';
// ... remaining bootstrap imports... 

Answer 2

您可以将这些导入移动到您的"src/styles.scss"文件中吗？

// src/styles.scss

@import "../node_modules/bootstrap/scss/functions";
@import "../node_modules/bootstrap/scss/variables";
@import "../node_modules/bootstrap/scss/mixins";