Question

我有几种样式使用Sass的@extend或@include继承从Bootstrap scss文件导入的选择器的属性。

我想将所有Bootstrap选择器转换为@extend-Only占位符，因此我不必在最终的.css输出中包含任何原始的Bootstrap选择器。目标是编写我自己的css类，只在需要时从Bootstrap扩展。

例如，我希望有一个名为.super-freaky-nav的导航栏：

.super-freaky-nav{
    @extend .navbar;
    @extend .navbar-default;
    @extend .navbar-top-fixed;
}

理想情况下，我的最终.css输出不会引用.navbar，.navbar-default或.navbar-top-fixed。

有没有办法在不进入_navbar.scss文件并将所有选择器转换为@extend-Only类（％navbar，％navbar-default，％navbar-top-fixed等）的情况下执行此操作？谢谢！

Answer 1

没有。 Sass没有能力做你想要的。仍然有合法的需要能够扩展正常的类，Sass无法区分应该或不应该扩展的类。

Answer 2

我正在探索的一个潜在实施方法是使用custom importers in ruby-sass或the experimental importers feature in node-sass (2.0+)将sed（查找和替换）转换应用于Bootstrap Sass文件，用{替换前导类定义{1}}语法。但是，我还没有经历过多少实验，如果没有全面的视觉测试套件，我也不知道自己可能会遇到什么。很高兴能得到一些帮助。

使用@extend-Only抽象Bootstrap选择器

2 个答案: