查找未使用的 CSS [重复]
Posted
技术标签:
【中文标题】查找未使用的 CSS [重复]【英文标题】：Find unused css [duplicate] 【发布时间】：2011-10-02 18:29:12 【问题描述】：我正在为我们内部网络上的一些页面进行一些开发。我想知道是否有可以识别项目中未使用的css的开源工具或FF插件。
我曾考虑过使用它，但当我尝试安装插件安装程序时显示“与 Firefox 3.6 不兼容”
https://addons.mozilla.org/en-US/firefox/addon/dust-me-selectors/
请注意，这是一个内部网 - 不是 www 可见的网站 - 所以我不能使用提供此类服务的在线网站。
【问题讨论】：
Dust-me 选择器与兼容 Firefox 3.6，但（当前）不兼容任何更高版本。 @Spudley 谢谢，但这是我通过 Mozilla 站点安装时遇到的错误消息。 我已经安装它并在我的 FF3.6 上工作，直到我升级，所以...... 耸耸肩....（并且Mozilla addons page 声明它兼容3.6，但你可能已经看到了）。 @Spudley 是的，我看到了，这让我认为它应该可以工作，我尝试再次安装，但它没有工作。也许您安装的版本是 后代更新：Dust-Me Selectors v3.0.1 目前在 Firefox 12 上为我工作。 【参考方案1】：我已经找了一段时间了，我发现最好的东西是这样的：
http://unused-css.com/
他们扫描您的网站并将结果 css 通过电子邮件发送给您。
我知道您正在使用本地站点，但是如果您找不到其他选择，您可以将您的站点上传到某个地方并使用它
或者
您可以安装与dust-me 选择器兼容的以前版本的firefox，并将其与当前安装的firefox 一起运行。
【讨论】：
经过相当长的一段时间后，这似乎是目前唯一可用的选项。谢谢 请注意，unused-css.com 不允许您在未成为付费会员的情况下下载 CSS，最低计划起价为每月 29 美元！对我来说服务似乎有点贵 感谢@georgiecasey，但请注意，这是在 2011 年回答的，当时它不是付费服务......【参考方案2】：Google Chrome（因此也可能是 Safari）安装了开发人员工具，这些工具与审核一起提供。当您审核页面时，它会检查未使用的 CSS 规则。
这是此页面上的外观。
【讨论】：
这行得通，但是对于大型项目，它可能是一个 PITA...您最终不得不跨页面手动运行它并区分它们 谢谢，不过我无法安装任何其他浏览器。 如果这个工具可以导出一个干净的 CSS 文件减去“未使用的”选择器，它也会很可爱 --- 除非我只是没有看到如何做到这一点。我们继承了一个 Joomla 网站，其中包含大约 94% 的未使用规则，其中包含数百个选择器和数十个我们想要删除的文件，但手动方法太不吸引人了，我们可能会全部放弃。【参考方案3】：我在 FF 中安装了CSS Usage。但几乎没有用过一次。它在当前页面上搜索未使用的 CSS，但不是整个项目。
【讨论】：
谢谢，这个至少安装好了。我会试一试。 Grr，它似乎不再起作用了，我收到了像这些人一样的“CSS 用法：初始化扩展”错误：addons.mozilla.org/en-US/firefox/addon/css-usage/reviews 同样感谢【参考方案4】：dust-me-selectors Firefox 插件现在与 Firefox 16 兼容...
【讨论】：
【参考方案5】：是否可以将所有 html 页面合并到一个页面中，例如使用：
type *.htm > all-pages.htm
那么你可以在这个单一的“超级”页面上运行 Firefox/CSS Usage 吗？
【讨论】：
【参考方案6】：sourceforge 有一个名为 CSS Scanner 的新程序，它可以扫描 html、aspx、php、javascript 和 jquery 代码中已使用和未使用的 css 类和样式表。 它是 .net 代码，因此您需要 Windows： http://sourceforge.net/projects/cssscanner/
【讨论】：
【参考方案7】：Chrome插件，它生成在页面中有效使用的css规则样式表，可以尝试快速结果..这里是链接
https://chrome.google.com/webstore/detail/css-remove-and-combine/cdfmaaeapjmacolkojefhfollmphonoh 它还给出了关于没有使用的规则的总结。
而这个涉及到 grunt 和相关插件来查找未使用的代码 http://addyosmani.com/blog/removing-unused-css/
【讨论】：
【参考方案8】：如果你熟悉node js你也可以使用“find有用的css”：https://www.npmjs.com/package/find-unused-css
【讨论】：
以上是关于查找未使用的 CSS [重复]的主要内容，如果未能解决你的问题，请参考以下文章