用 grunt 编译 sass 会产生无效的属性名称答案

【问题标题】：compiling sass with grunt produce invalid property name用 grunt 编译 sass 会产生无效的属性名称
【发布时间】：2014-12-15 03:50:04
【问题描述】：

我不知道为什么，但是在使用 grunt 或其他任何东西进行编译时，会出现一个名为 invalid property name 的错误

#flotTip {
    border: none !important;
    font-size: $font-size-small !important;
    line-height: 1px !important;
    @extend .tooltip-inner() !important; 
}

在上面的代码中的 line-height 会产生一个未定义的属性。我的任务是将所有 less 文件转换为 sass 文件。据我所知，使用了许多解决方案将它们全部转换为 sass。但是这个我找不到任何解决方案。谁能回答可能是什么问题？

【问题讨论】：

如果您还有其他问题，请提出其他问题。请勿将此问题修改为其他问题，尤其是在您收到基于原始问题的答案后。

标签： sass

【解决方案1】：

Extend 仅用于扩展简单的选择器，例如类、元素或 id。您不能将!important 与@extend 一起使用。这是使用extend的正确方法：

.foo {
    color: red;
}

#flotTip {
    @extend .foo; 
}

您可能会将extends 与mixins 混淆，后者也不能使用!important。这是使用 mixins 的正确方法：

@mixin foo() {
    color: red;
}

#flotTip {
    @include foo(); 
}

【讨论】：

【解决方案2】：

line-height: 1px !important; 行看起来不错。问题在于以下行。如果您尝试包含一个 mixin，请使用 @include 并且不要在 mixin 的名称前面加上 .（点）。另外，不要在后面加上!important。

【讨论】：

请再次检查问题。请查看它，因为我已经更新了问题部分。
不要不要用其他问题扩展您的原始问题。（答案是，您再次在 mixin 名称前加上 .。请在寻求帮助之前先查看您的代码。）
投反对票时，请说明原因，尤其是答案正确时。
我没有否决您的回答。我的问题也被否决了。不知道怎么办？

【解决方案3】：

我猜你错误地使用了@extend。在此处查看文档：http://sass-lang.com/documentation/file.SASS_REFERENCE.html#how_it_works

【讨论】：

请再次检查问题。请查看它，因为我已经更新了问题部分。