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

Question

尝试在我的 Angular 6 应用程序中使用 Bootstrap 4 a la carte，就像在我的 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）：

undefined ^$color的参数darken($color, $amount)必须是颜色

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

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

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

非常感谢任何帮助。

标签： bootstrap-4angular6

Answer 1

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

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