SASS＆符号在每个和父规则集中设置新行

Question

我对每个规则集都有特殊情况。 所以这是我的示例scss代码。对于样式指南来说似乎没问题，因为它在多行中写了不相关的规则。

$test: 'red' 'green';

.a,
.b {
  color: orange;
  @each $i in $test {
    .#{$i} & {
      color: #{$i};
    }
  }
}

我有以下生成的css文件：

.a,
.b {
  color: orange;
}
.red .a, .red
.b {
  color: red;
}
.green .a, .green
.b {
  color: green;
}

我不喜欢css中第二个选择器中间的新行。另一方面，我不想在scss的一行中编写所有选择器集，以准备将来每次注入。一行规则似乎没问题。

Ampersand似乎从第二个父选择器的开头得到了新的行（\ n）。

我怎么能让scss和css看起来很漂亮？我怎么能从＆符号中删除新的行字符？

编辑：更好的例子

Answer 1

你试过另一个output style吗？您可能喜欢expanded样式。