在自定义命名空间中使用 Twitterboostrap 4 mixin

Question

我正在我的自定义命名空间中使用 sass 编译 twitter boostrap 4：

//./main.scss
.twitter-bootstrap {
    @import "./my-scss/bootstrap-overrides";
}
@import ./my-scss/custom.scss

在bootstrap-overrides.scss中我只导入了一些组件（变量、mixins、函数在bootstrap-overrides.scss中导入

在自定义 scss 中，我想使用 mixin：

//./my-scss/custom.scss
@include media-breakpoint-up(md) {
...
}

我的编译器显示错误：

Error: Undefined mixin.
   ╷
18 │ ┌   @include media-breakpoint-up(md) {
19 │ │     ...
20 │ │     
21 │ └   }
   ╵
  main.scss 15:9                  root stylesheet

如何在 scss 文件中使用 twitterbootstrap 4 mixin？

Answer 1

按此顺序导入

@import "path/scss/functions";
@import "path/scss/variables";
@import "path/scss/mixins";
@import ./my-scss/custom.scss;

现在您可以使用custom.scss 中的所有引导混合。