如何在s CSS中导入和使用Bulma框架,而不是将其所有内容导出到CSS

在我最近的web项目中,我经常使用Bulma CSS框架,它让我的工作变得简单明了。

不过,我没有使用它的大部分功能,只是一些。我知道我只能导入我需要的文件,例如:如果我只需要列系统,我将创建一个这样的SCSS文件:

@import "bulma/sass/utilities/_all.sass";
@import "bulma/sass/base/_all.sass";
@import "bulma/sass/grid/columns.sass";

.my-column {
  @extend .column;
  ...
}

但是生成的CSS文件将用这样的行填充:

/* line 3, ../sass/bulma/sass/grid/columns.sass */
.column, .my-column {
  display: block;
  flex-basis: 0;
  flex-grow: 1;
  flex-shrink: 1;
  padding: 0.75rem;
}
/* line 9, ../sass/bulma/sass/grid/columns.sass */
.columns.is-mobile > .column.is-narrow, .columns.is-mobile > .is-narrow.my-column {
  flex: none;
}
/* line 11, ../sass/bulma/sass/grid/columns.sass */
.columns.is-mobile > .column.is-full, .columns.is-mobile > .is-full.my-column {
  flex: none;
  width: 100%;
}
/* line 14, ../sass/bulma/sass/grid/columns.sass */
.columns.is-mobile > .column.is-three-quarters, .columns.is-mobile > .is-    three-quarters.my-column {
  flex: none;
  width: 75%;
}

第一个街区是我唯一想要的。我不会在HTML中使用大多数生成的类,只使用my column类。

我要找的是预处理器只包括在我声明的类(我的列)中,以这种方式需要什么:

.my-column {
  display: block;
  flex-basis: 0;
  flex-grow: 1;
  flex-shrink: 1;
  padding: 0.75rem;
}

我不知道是否有可能,也许没有必要,因为Bulma框架非常轻量级。我只是不喜欢在CSS文件中有这么多不必要的东西。

也许我刚刚把整个SCSS预处理器搞错了。但如果我没有在任何方面表明自己,请在评论中告诉我。

谢谢你的时间!