css - Sass 错误 : selector groups may not be extended

Question

我在尝试将我的 SCSS 文件编译成 CSS 时遇到错误。错误内容为:引用此行 @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，它与通过传统方式可用的当前版本的 sass 不匹配 https://github.com/andrew/node-sass#reporting-sass-compilation-and-syntax-issues .

Answer 1

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

尝试使用这个:

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

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

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

Multiple extends can also be written using a comma-separated list of selectors. For example, @extend .error, .attention is the same as @extend .error; @extend.attention.

我确实找到了 in the changelog这种格式是在版本 3.1.15 中首次引入的，所以我想你使用的 Sass 版本比那个版本要旧。

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