选择器的自动修复顺序

如何解决选择器的自动修复顺序

我们对我们的应用程序使用 SonarQube。 SonarQube 规则之一说：

低特异性的选择器应该优先于高特异性的选择器

详情是here。由于我的应用程序有很多违规行为，手动更改顺序实际上并不可行。我想知道是否有一种方法可以在“修复”模式下使用 scss-lint、stylelint 或其他可以改变选择器顺序的东西。我看了看，但在 stylelint 中找不到任何东西。也许它不能安全地自动完成，因为更改顺序可能会影响特异性，从而改变应用程序行为...

解决方法

就我个人而言！知道没有提供该功能的 Linter。 （我对此很好奇。）但只是关于遵守该“规则”的必要性的一些想法：

确实：以具有较低特异性的选择器优先的方式编写 SASS/CSS 是一个很好的实践。 CSS 结构变得更具可读性，并且更容易构建您的代码结构，因为您的头脑（和代码）中有更清晰的系统。

但只是从机制 CSS 工作真的没有必要这样做。代码这样做并不会变得更安全或不那么安全，并且页面加载速度不会变慢。这就是特定性机制的作用：从特定性来看，选择器的顺序并不重要，您可以按照需要的顺序编写代码。仅当规格相同时，订单才算数。

所以，也许这条规则会导致“更好”的代码。但是：并非所有规则都需要满足。并非 Google 尝试使用他们在浏览器中提供的最佳实践规则建立的所有规则，也不是其他分析工具提供的所有规则都需要遵守。

如果不在这个项目中，因为它需要资源来纠正它......它可能可以但尚未成为下一个项目的目标;-)