Question

我在尝试将我的SCSS文件编译成CSS时遇到错误。错误如下：＆＃34;选择器组可能无法扩展＆＃34;参考这一行@extend .btn, .btn-link;。

注意：我导入Bootstrap以在我的主scss文件中使用。

完整摘录：

button {
    @extend .btn, .btn-link;
    background-color: $lf-green;
    color: #fff;
    font-size: 10px;
    padding: 2px 5px;
    text-transform: uppercase;

    &:hover {
        background: rgba(5,97,43,0.9);
        color: #fff;
        text-decoration: none;
    }
}

我做错了什么？

谢谢！

更新

对于后代：我无法做到这一点的原因是因为我通过node-sass使用lib-sass，它没有通过传统方式{{3}与当前版本的sass相匹配}。

Answer 1

我相信你不能用这种方式扩展多个选择器。

尝试使用：

@extend .btn;
@extend .btn-link;

虽然这看起来有点重复，但在我的代码中工作正常。

编辑：在阅读SASS_REFERENCE时，我发现：

也可以使用以逗号分隔的选择器列表来编写多个扩展。例如，@ extend .error，。disttion与@extend .error相同; @ extend.attention。

我确实发现in the changelog这种格式最初是在3.1.15版本中引入的，所以我想你使用的是旧版本的Sass。

我强烈建议您升级到最新版本，因为它有很多很棒的功能，只要确保您的代码不会被更新破坏，尽管大多数不一致都可以很容易地解决。

Answer 2

您无法扩展多个选择器。

Sass错误：选择器组可能无法扩展

2 个答案: