跨 CSS 文件重命名 HTML 类

Question

如果我有 100 个 HTML 文件，这些文件使用一组在 CSS 文件中用作选择器的类，是否有一个实用程序可以用来智能地重命名这些类？

我知道每个编辑器/IDE 都有在项目中查找/替换的功能。使用 sed 你可以做同样的事情。这并不智能，因为它只是简单的字符串替换。我想知道有一个工具能够真正理解 CSS 类是什么以及如何替换它的实例。我想一个奇特的正则表达式可以做同样的事情。

Answer 1

我认为您正在寻找 Google 的闭包样式表。
其中之一闭包样式表功能是重命名。

闭包样式表重命名功能的示例如下。

<style>
  .descriptive-parent-class-name .descriptive-element-class-name {color:red;}
</style>
<div class="descriptive-parent-class-name">
  <p class="descriptive-element-class-name">Lorem ipsum</p>
  <p class="descriptive-element-class-name">Lorem ipsum</p>
</div>

也会

<style>
  .a-b .a-c {color:red;}
</style>
<div class="a-b">
  <p class="a-c">Lorem ipsum</p>
  <p class="a-c">Lorem ipsum</p>
</div>

有进一步的缩小功能。

另请检查闭包编译器。

如果你检查任何 Google/Facebook 页面，你会发现它们的类和 ID 名称几乎不会超过 4 个随机字符

Answer 2

看一下 Netbeans 6.9 m1。它具有 CSS 重构/查找用法支持，也许这就是您正在寻找的。

http://wiki.netbeans.org/NewAndNoteworthy69m1#CSS_Refactoring_.2F_Find_Usages_Support

Answer 3

如果这仍然是最新的，那么有一个名为 rcs 的库，它是 rename-css-selectors 的缩写。

这是库，它非常容易使用： rcs-core

它附带很多插件，例如 webpack、parcel 和 node： https://github.com /JPeer264/node-rcs-core#plugins