Bootstrap 编译时是否可以排除导入的.scss文件

ljo96ir5  于 2022-12-07  发布在  Bootstrap
关注(0)|答案(1)|浏览(167)

我想做一个Bootstrap框架的插件,并想在我自己的代码/类中使用一些变量,mixin,函数等。但是当我编译项目时,我不想把整个Bootstrap项目和我自己的代码沿着编译。
示例:我想创建一个新的按钮类型,并需要主题颜色。

应用程序.scss

/* The Bootstrap library */
@import "../node_modules/bootstrap/scss/bootstrap";

/* My own components */
@import "my-button.scss";

然后我使用PostCSS编译app. scss。我可以使用Bootstrap文件中的主题Map和对比度计算,但不将整个Bootstrap项目编译到我的app.css文件中吗?

0sgqnhkj

0sgqnhkj1#

是的,你可以导入部分文件来访问变量,Map和函数。整个过程在Bootstrap文档中描述。https://getbootstrap.com/docs/5.2/customize/sass/
下面是一个示例:

// Custom.scss
// Option B: Include parts of Bootstrap

// 1. Include functions first (so you can manipulate colors, SVGs, calc, etc)
@import "../node_modules/bootstrap/scss/functions";

// 2. Include any default variable overrides here

// 3. Include remainder of required Bootstrap stylesheets
@import "../node_modules/bootstrap/scss/variables";

// 4. Include any default map overrides here

// 5. Include remainder of required parts
@import "../node_modules/bootstrap/scss/maps";
@import "../node_modules/bootstrap/scss/mixins";

/* My own components */
@import "my-button.scss";

相关问题