如何防止在输出CSS中解包嵌套的SCSS规则？

How to prevent unwrapping of nested SCSS rules in output CSS?

提问人：yakunins 提问时间：7/15/2023 更新时间：7/15/2023 访问量：28

问：

最近的浏览器对嵌套 CSS （https://caniuse.com/css-nesting） 有很好的支持。

在某些编译器中，是否有一些选项可以保持嵌套规则不变？

DART SASS 的提案，请参阅 https://github.com/sass/sass/blob/main/proposal/plain-css-nesting.md

输入 SCSS 示例：

$r: red;
.c1 {
  .c2 { color: $r; }
}

输出示例：

.c1 {
  .c2 { color: red; }
}
css sass 嵌套 css 选择器

评论

2赞 Harrison 7/15/2023
我不确定编译器中是否有任何选项。截至 2023 年 7 月，caniuse 仅显示大约 72%，我不会将其归类为“好”，因为浏览器今年才开始支持这，而且典型用户不会像 SO 社区那样更新他们的软件（例如：statista.com/statistics/271774/...（对不起，意见部分）我想说的是，良好的覆盖率必须至少为 2 年并且远高于 85% 的覆盖率，即使这样也值得商榷

答： 暂无答案

上一个：无法使用 Tailwind CSS 正确配置 CSS 嵌套

下一个：&ers和 postcss-nested 在 create-react-app 中不起作用