sass语法中不要写css语法

起因

在scss文件中，有这样的样式

$mui-steps:hello;
$mui-steps-item-prefix: hello-item;

.#{$mui-steps-item-prefix}{
      &-wait &-description {
       color: #000000;
      }
}

这样样式是生效的。但是如果我这样写

$mui-steps{
    .#{$mui-steps-item-prefix}{
        &-wait &-description {
            color: #000000;
        }
}

样式无法生效。完全不知道为啥。于是我安装了node-sass，看一下解析成css的效果

前一个是这样：

.hello-item-wait .hello-item-description {
  color: #000000;
 }

的确，和元素的结构一致。
后一个是这样：

.hello .hello-item-wait .hello .hello-item-description {
  color: #000000;
 }

和元素的结果不一样了。
我猜测是这样的，sass估计无法解析空格。所以只能将空格复制。前一个正好解析成正确的结果。
这说明，在sass语法中混合css语法是有问题的。
当然，可以进一步去看一下sass的源码看他如何解析scss文件的。