Как мы используем ng-bootstrap для mixins, переменных - PullRequest
0 голосов
/ 05 мая 2019

Я установил @ ng-bootstrap, теперь я хочу использовать миксины внутри моего app.component.scss , но получаю сообщение об ошибке

Failed to compile.
./src/app/app.component.scss
Module build failed (from ./node_modules/sass-loader/lib/loader.js):
@import "~bootstrap/scss/functions";
^
      File to import not found or unreadable: ~bootstrap/scss/functions.
      in C:\Users\xxxx\tutorial\xxxx\src\app\app.component.scss (line 1, column 1) 

Следующее - мой app.component.scss

@import "~bootstrap/scss/functions";
@import "~bootstrap/scss/variables";
@import '~bootstrap/scss/mixins/_breakpoints';
.header_static{
  position: absolute;
  z-index: 500;
  padding-top: 15px;
  padding-bottom: 15px;
  @include media-breakpoint-down(xs) {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}

Ответы [ 2 ]

0 голосов
/ 06 мая 2019

Было недоразумение с моей стороны.Я думал, что при установке ng-bootstrap, он принесет требуемый загрузчик, но он не будет.

Полностью пропустил это Here is a list of minimal required versions of Angular and Bootstrap CSS for ng-bootstrap: из Виджеты начальной загрузки - Введение Затем выполните следующие операции импорта на вашем src /styles.scss

@import "~bootstrap/scss/bootstrap";
@import "~bootstrap/scss/functions";
@import "~bootstrap/scss/variables";
@import "~bootstrap/scss/mixins";
@import "~bootstrap/scss/print";
@import "~bootstrap/scss/reboot";
@import "~bootstrap/scss/type";
@import "~bootstrap/scss/images";
@import "~bootstrap/scss/code";
@import "~bootstrap/scss/grid";
0 голосов
/ 05 мая 2019

Попробуйте импортировать напрямую из папки node_modules

@import "../node_modules/bootstrap/scss/variables";
@import "../node_modules/bootstrap/scss/fucntions";
@import "../node_modules/bootstrap/scss/mixins/_brekapoints";
...