Question

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

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

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

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

有可能吗？我错过了什么？ SASS有可能吗？

Answer 1

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;
}

如何@import不包括所有CSS，只包括@extends

1 个答案: