less-loader忽略空规则集

Question

我正在使用less-loader将less加载到css中。然后，我在TypeScript中使用css模块加载器的类型来获取类名常量。

问题是，我首先开发的是原始标记。在标记的开发过程中，我在LESS中创建了空的规则集来获取类名常量，并在标记中使用它们。但是因为LESS忽略了空规则集，所以不会生成常量。

当我向规则集中添加任何样式时，都会正确地生成常量。

例如：

.tooltip { // constant "tooltip" is generated 
    display: none;

    &__name { // constant "tooltipName" is generated
        color: inherit;
    }

    &__id { // constant "tooltipId" is NOT generated

    }
}

我可以在每个新规则集中添加一些虚拟样式，但这会很烦人。

我使用WebPack、ReactJS和TypeScript。我正在寻找一些我可以在webpack.config中使用的配置来改变这个行为。

Answer 1

我发现这是less包的行为，而不是less-loader的行为。有一个功能请求来实现保留空规则集的可能性：https://github.com/less/less.js/issues/1006

还有一种更聪明的方法可以在输出中保留空规则集。只需在其中添加空(或不添加)注释：

.tooltip__id { // constant "tooltipId" IS generated
    /**/
}