本文介绍了使用sass 3自定义Bootstrap 5颜色时出现无效的CSS值错误的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我想用sass更改bootstrap的默认主题颜色，问题是当我更改颜色并进行编译时，它会给出无效的CSS值错误。
我已经在YouTube上看了文档和一些教程，但我看不出问题出在哪里
我使用的是Bootstrap 5.1.0，sass 3 这是我的SCSS文件：@import "../../node_modules/bootstrap/scss/variables";
$theme-colors: (
"primary": //some color here,
);
@import "../../node_modules/bootstrap/scss/bootstrap";
这是我在终端中收到的错误
PS F:Codingprojectssepehrclientsrcstyles> sass style.scss custom.css
Error: ("primary": #0d6efd, "secondary": #6c757d, "success": #198754, "info": #0dcaf0,
"warning": #ffc107, "danger": #dc3545, "light": #f8f9fa, "dark": #212529) isn't a valid
CSS value.
╷
94 │ $theme-colors-rgb: map-loop($theme-colors, to-rgb, "$value") !default;
│ ^^^^^^^^^^^^^
╵
推荐答案
您还需要导入函数和混合...
@import "../../node_modules/bootstrap/scss/functions";
@import "../../node_modules/bootstrap/scss/variables";
@import "../../node_modules/bootstrap/scss/mixins";
另见：Bootstrap 5 - Custom theme-colors not updating classes
这篇关于使用sass 3自定义Bootstrap 5颜色时出现无效的CSS值错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！
本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除！