未使用的 css - 如何清理它?

2024-04-09

也许任何有经验的 Web 开发人员都会熟悉这个问题:随着时间的推移,你的 css 文件可能会变得非常巨大和丑陋,因为所有不再使用的选择器,这可能很难找到。我正在开发一个 Rails 项目,我们经常重新设计一些东西,这会导致大量的 CSS 负担。找到并删除它的最佳方法是什么?

现在,我确实知道有一个名为 deadweight 的 Rails 插件专门为此目的而构建。然而,这是我的无谓问题:首先,它完全忽略了 javascript 中使用的选择器。接下来,它仅扫描您配置为扫描的页面,这意味着存在删除因某种原因未扫描的页面上使用的内容的风险。最后,它仅在编译的 css 中找到未使用的选择器(我们使用 LESS)——将这些选择器与实际代码进行匹配有点过于复杂。

我也尝试过http://unused-css.com/ http://unused-css.com/- 它们很棒,但无法访问本地主机,并且只能扫描编译的 CSS。

我真的认为必须有更好的方法来做到这一点。实际上,前一段时间我决定通过 grep 整个项目目录中的每个选择器来优化一个特定的 css 文件(emacs + rinari 模式使其超级简单且超级快速),并且每次我都没有看到任何 html 或 css在结果中我删除了样式。零问题,效果非常好。显然,我不会对整个网站都这样做。然而,我真的不相信这不能自动化。现在,在我启动 python 并编写代码之前,有人能真正告诉我是否要重新发明轮子吗?


查看uCSS库 https://github.com/operasoftware/ucss来自 Opera 软件。

它可以帮助您找到未使用的 CSS 以及重复的 CSS。此外,您还可以概览每个规则在标记中的使用次数。通过设置配置文件可以使用多个选项。

Update:

另一个不错的选择:csscss https://github.com/zmoazeni/csscss.

用 Ruby 编写,支持 SASS、Less。

Update:

另一个不错的选择:uncss https://github.com/giakki/uncss.

它可以跨多个文件工作,并支持 Javascript 注入的 CSS。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

未使用的 css - 如何清理它? 的相关文章

随机推荐