在 Bootstrap 4 / SASS 中使用媒体断点 - _breakpoints.scss 不知道 $grid-breakpoints

Question

我正在尝试在 Bootstrap 4 中使用媒体查询。

在他们的网站上，他们这样做：

@include media-breakpoint-up(xs) { ... }
@include media-breakpoint-up(sm) { ... }
@include media-breakpoint-up(md) { ... }
@include media-breakpoint-up(lg) { ... }
@include media-breakpoint-up(xl) { ... }

// Example usage:
@include media-breakpoint-up(sm) {
  .some-class {
    display: block;
  }
}

所以我抓住了 Bootstrap SCSS，复制了它_breakpoints.scss并将其包含在我的项目中。我导入它，然后尝试使用媒体查询：

@import "partials/breakpoints";

@include media-breakpoint-up(sm) {

  .mycontainer  {
    background-color: black;
  }
}

但是，当我编译 SASS 时出现以下错误：

检测到的更改为：main.scss 错误页面/_geschichte.scss（第 54 行：未定义变量：“$grid-breakpoints”。）

我这样做是错误的方式还是需要包含更多文件？然后我尝试通过还包括 来解决这个问题_grid.scss，但是为此，又需要其他一些东西，所以我不确定这是否确实是正确的方法，并认为我最好问一下。

Answer 1

您是否包含引导程序 variables.scss ？似乎缺少变量