如何通过mixin生成的SASS类具有自动完成功能

Question

我有一个mixin可以为flex的方向生成类。

这是代码段：

// Generated class
$flex-directions: 'row', 'row-reverse', 'column', 'column-reverse', 'normal';
@each $direction in $flex-directions {
  .flex-#{$direction} {
    @include flex-direction(#{$direction});
  }
}

但是在我的HTML代码中，WebStorm不建议使用mixins创建的类。

如何创建一个混合接口或其他使WebStorm中的类自动完成的方法？

Answer 1

您可以通过each指令生成类。您不需要使用mixin

$flex-directions: 'row', 'row-reverse', 'column', 'column-reverse', 'normal';
@each $direction in $flex-directions {
  .flex-#{$direction} {
    flex-direction:  #{$direction};
  }
}

[如果需要，您还可以检查无礼的牧师link。希望对您有帮助