在 Bootstrap 4.3.1 中覆盖 _variables 的正确方法是什么？

Question

我在 angular 8 项目中使用 Bootstrap 4.3.1。基本上我想（更改/覆盖）bootstrap 的一些默认变量。比如 $font-size-base

我试过下面的代码，但这根本不起作用，请告诉我什么是（自定义/更改/覆盖）angular 项目中 bootstrap scss 变量的正确方法.

angular.json

"styles": [
          "node_modules/bootstrap/dist/css/bootstrap.min.css",
          "src/scss/style.scss"
        ],

style.scss

@import "../../node_modules/bootstrap/scss/_functions";
@import "../../node_modules/bootstrap/scss/_variables";
@import "../../node_modules/bootstrap/scss/mixins";
$font-size-base: 0.655rem;

package.json

"@ng-bootstrap/ng-bootstrap": "^5.1.2",
"bootstrap": "^4.3.1",

运行 angular 项目时仍显示默认字体大小。

Answer 1

@JB Nizet 评论中提到了我的问题的答案。

我发布这个答案是为了向即将到来的开发者展示小步骤，他们愿意知道我的问题的实际答案。

如果您将 Angular 8 与 Bootstrap ^4.3.1 一起使用，那么 angular.json 文件中的样式节点应如下所示：

"styles": [
   //"node_modules/bootstrap/scss/bootstrap.scss",
   //"node_modules/bootstrap/dist/css/bootstrap.min.css",
   "src/scss/style.scss"
],

你的 style.scss 就像：

/* You can add global styles to this file, and also import other style files */
$font-size-base: 0.875rem;
@import "../../node_modules/bootstrap/scss/bootstrap";

在 Bootstrap 4.3.1 中覆盖 _variables 的正确方法是什么？

What is the right way to override _variables in Bootstrap 4.3.1?

angular-bootstrap

bootstrap-4

ng-bootstrap

angular

angular8