Sass: 声明只能在样式规则中使用

Question

我遇到了一个Sass错误：声明只能在样式规则中使用。

   ╷
32 │     #{$property}: $value;
   │     ^^^^^^^^^^^^^^^^^^^^

以下是该文件的内容：

@mixin theme($colour, $texture: null) {
  $theme: map-get-strict($themes, $colour, "theme");

  @if ($texture) {
    @include getTexture($texture);
  }

  @each $property, $value in $theme {
    #{$property}: $value;
  }
}

这里使用的是dart-sass。

我认为可能是一个Sass测试文件引起了问题，例如：

@include it('outputs the light-blue theme') {
    @include assert {
      @include output {
        @include theme(light-blue);
      }

      @include expect {
        background-color: getColour(light-blue);
        color: getColour(black);
      }
    }
  }

- Ollie Williams

---

你是否在选择器中包含了mixin？ - Arkellys

Mixin 也被用于测试文件中，这可能是问题所在。我在我的问题中添加了一些代码。 - Ollie Williams

你不能在根元素中使用这个mixin，它需要一个父级选择器，这就是错误的含义。 - Arkellys

那么测试应该如何编写？ - Ollie Williams

我不知道这个问题的答案，很抱歉。我甚至不知道为SASS编写测试是一件事情。 - Arkellys

Answer 1

声明只能在样式规则内部使用。

您只能在样式规则内使用声明。这意味着如果您有一个包含声明的mixin

例如：

@mixin foo() {
  color: #000;
}

您只能将它包含在样式规则中。

例如：

.bar {
  @include foo();
}

---

这有助于确保编译后的 CSS 没有错误。

---

color: #000;

.bar {
  color: #000;
}

- Simplicius