Scss：@include media-breakpoint-down：未定义的mixin，但我导入了引导类

Question

我尝试在 Angular 中使用 @include media-breakpoint-up 但在编译时出现此错误

\n

引导程序5.1.13

\n

角度 CLI：10.2.4

\n

节点：14.17.2

\n

操作系统：win32 x64

\n

角度：10.2.5

\n

ERROR in Module build failed (from ./node_modules/sass-loader/dist/cjs.js):\nSassError: Undefined mixin.\n  \xe2\x95\xb7\n6 \xe2\x94\x82 \xe2\x94\x8c         @include media-breakpoint-down(md) {\n7 \xe2\x94\x82 \xe2\x94\x82             width: 100%;\n8 \xe2\x94\x82 \xe2\x94\x82             margin: 0 10px 0 10px;\n9 \xe2\x94\x82 \xe2\x94\x94         }\n

\n

风格类

\n

.mat-form-field{\n        width: 460px;\n\n        @include media-breakpoint-down(md) {\n            width: 100%;\n            margin: 0 10px 0 10px;\n        }\n    } \n

\n

导入 main.scss\n@import '~bootstrap/scss/bootstrap-utilities';

\n

html中的bootrap类正常工作

\n

哪里错了？\n谢谢

\n

我尝试导入每个引导类（按正确的顺序），我尝试重新启动 Angular ng 服务但从未工作

\n

Answer 1

@import 'node_modules/bootstrap/scss/functions';
@import 'node_modules/bootstrap/scss/variables';
@import 'node_modules/bootstrap/scss/mixins';

需要这些进口才能发挥作用

Answer 2

正如克隆所建议的，您必须在每个 SCSS 组件上导入引导文件。