如何在引导程序 4 angular 中覆盖网格变量答案

【问题标题】：how to override grid variable in bootstrap 4 angular如何在引导程序 4 angular 中覆盖网格变量
【发布时间】：2019-05-03 08:41:17
【问题描述】：

如何真正覆盖引导变量？我试试这个，但不工作

// overrides.scss
@import '~bootstrap/scss/functions';
@import '~bootstrap/scss/variables';
@import '~bootstrap/scss/mixins';

@import 'variables.scss'; // my own variables
$grid-columns: 12;
$grid-gutter-width: 16px;
@import '~bootstrap/scss/bootstrap.scss';

// global styles
@import 'overrides.scss';
@import '~bootstrap/scss/bootstrap.scss';

我正在使用 Angular 2+，只想将行的间距宽度从 30px 设置为 16px，有什么解决方案吗？

【问题讨论】：

标签： angular variables sass bootstrap-4

【解决方案1】：

没有理由两次导入 Bootstrap。最后只导入一次...

@import 'bootstrap/functions';
@import 'bootstrap/variables';

$grid-columns: 12;
$grid-gutter-width: 16px;

@import 'bootstrap';

演示：https://www.codeply.com/go/wSyODZFc0b

【讨论】：