Sass 与符号和更新的编译器问题

Question

我正在尝试设置 link 样式并遵循 BEM 原则，但我从 sass 编译器中收到错误消息。这是 html

<a href="#" class="sg-link sg-link-icon">Link with icon</a>

这是 sass 内容：

.sg-link {
    color: #111;
    text-decoration: none;

    &-icon {

        &:before {
            margin-right: 10px;
        }
    }

    &:hover{
        color: $maggie;
    }
}

现在，当 sass watch 编译时，我在终端中收到此错误：

error source/scss/atoms/_02-links.scss (Line 7: Invalid CSS after "    &": expected "{", was "-icon {"

"-icon" may only be used at the beginning of a compound selector.)

我以前使用过这种技术并且一直有效，所以我想也许 sass 版本与它有关。我正在使用 Sass 3.2.13 (Media Mark)。所以我检查了 sass 网站，最新版本应该是 Sass 3.4.13 (Selective Steve) 但是当我尝试用 gem update sass 更新时，它没有说要更新。也尝试过 sudo 但没有运气。想法？

编辑： 我刚刚在 Sassmeister 上检查了相同的代码，它工作正常

提前致谢

Answer 1

您对 Sass 版本的看法是正确的。使用 Sassmeister，您可以看到您的代码片段在 Sass v3.4.x 编译，但在 3.2.x 不编译（您可以在中配置 Sass 版本控制面板，齿轮图标菜单下）。

至于为什么您在您的环境中更新 Sass 时遇到问题，这可能超出了这个问题的范围，但可能是您系统的 Ruby/gem 版本已过时。您可能会考虑使用 Ruby 版本管理工具，例如 rbenv or chruby，以便更好地控制安装的 gem 版本。我怀疑安装 rbenv（例如），使用它安装最新版本的 Ruby，然后从那里安装 Sass 和 gem 可以解决您的问题。

（免责声明：我对 Ruby 不是很有经验，但我发现像上面描述的那样的设置很适合我。）

Sass 与符号和更新的编译器问题

Sass compiler issues with ampersand and with update

css

ruby

terminal

sass