用父类包裹子scss文件

Question

有没有办法将父类添加到子 scss 文件中的所有规则中。通过将子文件解释为已经编译过？

目前，我尝试@import用父类包装 an ，但它没有按预期工作。

父级.scss

.parent{
   @import 'child';
}

孩子.scss

.child{
   .dark &{
      color: blue;
   }
}

实际产量

.parent{
   @import 'child';
}

预期产出

.child{
   .dark &{
      color: blue;
   }
}

Answer 1

我终于找到了使用meta.load-css() mixin的解决方案

孩子.scss

.child{
   .dark &{
      color: blue;
   }
}

父级.scss

@use "sass:meta";
.parent {
    @include meta.load-css("child");
}

这是一个工作示例：https ://github.com/zeckaissue/Wrap-child-scss-file-with-parent-class