sass - 在 Bootstrap 5 中使用 SCSS 导入间距(边距、填充等)

标签 sass bootstrap-5

我可能在这里遗漏了一些明显的东西 - 我正在尝试使用 SCSS 编译我的 Bootstrap,所以我可以选择我需要的文件。一切都很好,直到我到达边距和填充类(例如 mt-0)。我认为这些是utilities.scss 的一部分,但显然不是,而且我似乎无法找到它们。我在这里错过了一个明显的包含吗?

@import "../../node_modules/bootstrap/scss/functions";
@import "../../node_modules/bootstrap/scss/variables";
@import "../../node_modules/bootstrap/scss/mixins";
@import "../../node_modules/bootstrap/scss/utilities";


// Optional
@import "../../node_modules/bootstrap/scss/root";
@import "../../node_modules/bootstrap/scss/reboot";
@import "../../node_modules/bootstrap/scss/type";
@import "../../node_modules/bootstrap/scss/images";
@import "../../node_modules/bootstrap/scss/containers";
@import "../../node_modules/bootstrap/scss/grid";

最佳答案

边距和填充类(例如 mt-0)的映射位于 _utilities.scss [1] 文件中,但它使用实用程序/_api.scss [2] 生成类,因此您需要在实用程序导入下方:

@import "../../node_modules/bootstrap/scss/utilities/api";
引用
[1] 实用程序文件 ( https://github.com/twbs/bootstrap/blob/5f89ea3a0f9b56547eb03b98afcd189b89d7e5a6/scss/_utilities.scss )
[2] 实用程序 API 文件 ( https://github.com/twbs/bootstrap/blob/5f89ea3a0f9b56547eb03b98afcd189b89d7e5a6/scss/_utilities.scss )

关于sass - 在 Bootstrap 5 中使用 SCSS 导入间距(边距、填充等),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65293440/

相关文章:

reactjs - 我可以在reactjs中使用常规的bootstrap toast吗?

css - 如何在 bootstrap 和 sass 中更改导航栏的属性值

css - 如何防止样式表变得一团糟?

twitter-bootstrap - 用于文本区域的 Bootstrap 5 float 标签与滚动输入重叠

html - 如何在 Bootstrap 5 中合并 2 个 DIV 表行

javascript - Bootstrap-vue 导航栏未按预期呈现

css - 不能使用带有文本或背景的主题颜色

javascript - 如何通过 Webpack 部署名称中带有哈希值的 Assets ?

css - 为什么 CSS 在我的 Angular2 开发服务器和生产版本上看起来不同?

node.js - 编译node-sass需要10分钟