如何在 bootstrapvue 中更改主题颜色？

Question

我需要在我的 bootstrapvue 项目中更改此颜色，但我不知道如何更改。

主要次要成功信息警告危险光暗

Answer 1

只需阅读文档；) https://bootstrap-vue.js.org/docs/reference/theming/

就像在普通的 Bootstrap（没有 vue）中一样，你在 bootstrap 库目录（https://github.com/twbs/bootstrap/blob/master/scss/_variables.scss）的_variables.scss 中拥有所有变量。

您可以复制它并修改或创建名为 ex 的新空​​文件。variables.scss 并在导入 Bootstrap 之前导入它。或者干脆把变量放在@import 之前。

// Your variable overrides
$body-bg: #000;
$body-color: #111;

// Bootstrap and its default variables
@import '../node_modules/bootstrap/scss/bootstrap';
// BootstrapVue and its default variables
@import '../node_modules/bootstrap-vue/src/index.scss';

如果您需要更换颜色，它将是：

$red: '#ff0000';