问题描述
我们对我们的应用程序使用 SonarQube。 SonarQube 规则之一说:
低特异性的选择器应该优先于高特异性的选择器
详情是here。由于我的应用程序有很多违规行为,手动更改顺序实际上并不可行。我想知道是否有一种方法可以在“修复”模式下使用 scss-lint、stylelint 或其他可以改变选择器顺序的东西。我看了看,但在 stylelint 中找不到任何东西。也许它不能安全地自动完成,因为更改顺序可能会影响特异性,从而改变应用程序行为...
解决方法
就我个人而言!知道没有提供该功能的 Linter。 (我对此很好奇。)但只是关于遵守该“规则”的必要性的一些想法:
确实:以具有较低特异性的选择器优先的方式编写 SASS/CSS 是一个很好的实践。 CSS 结构变得更具可读性,并且更容易构建您的代码结构,因为您的头脑(和代码)中有更清晰的系统。
但只是从机制 CSS 工作真的没有必要这样做。代码这样做并不会变得更安全或不那么安全,并且页面加载速度不会变慢。这就是特定性机制的作用:从特定性来看,选择器的顺序并不重要,您可以按照需要的顺序编写代码。仅当规格相同时,订单才算数。
所以,也许这条规则会导致“更好”的代码。但是:并非所有规则都需要满足。并非 Google 尝试使用他们在浏览器中提供的最佳实践规则建立的所有规则,也不是其他分析工具提供的所有规则都需要遵守。
如果不在这个项目中,因为它需要资源来纠正它......它可能可以但尚未成为下一个项目的目标;-)