css - 如何@import不包括所有CSS，仅包括@extends的CSS

我正在使用带有手写笔的手写笔。这是我的app.styl代码

@import "../../node_modules/bootstrap-stylus/lib/bootstrap.styl";
section
    @extend .row

运行gulp后，我注意到完整的引导CSS已包含在目标app.css中。我想使用.row rule仅动态包含@extend。我想要得到的是这个。

section { //.row rules
    zoom: 1;
    margin-left: -20px;
}

可能吗？我想念什么？ SASS可以吗？

最佳答案

AFAIK手写笔和sass都不支持仅导入文件的某些选择器。但是，如果您可以控制导入的文件，则可以使用SASS placeholder selectors代替类/ id。占位符选择器是某种抽象选择器，默认情况下根本不呈现任何内容。

/* _partial.scss */
%some-selector {
  prop: value;
}
%another-selector {
  prop: value;
}

/* main.scss */
@import 'partial';
.some-class {
  @extend %some-selector;
}

导致未扩展的占位符选择器被忽略（在本例中为%another-selector）

/* output.css */
.some-class {
  prop: value;
}

关于css - 如何@import不包括所有CSS，仅包括@extends的CSS，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40301362/