在Web项目中查找未使用的CSS规则和js脚本？

Question

HI ..我的项目有许多CSS角色和JavaScript脚本,我的项目中没有使用它们.我怎样才能找到这些未使用的文件？

Answer 1

有一个很好的小火狐插件叫做Dust Me Selectors,它可以扫描页面中没有使用的CSS.

这是一个非常好的工具,用于在样式表中发现冗余的东西.

但是,您仍然需要小心,因为在运行程序时样式表很可能未被使用,但仍然需要您的站点 - 即它可以用于动态内容,或用于其他共享的页面相同的样式表代码等

[编辑]

我删除了之前的编辑,我注意到这个项目可能已被放弃,因为事实上它看起来像是在积极开发中.全面的好消息.

Answer 2

当我需要这样做时,我已经使用了开发环境的搜索功能来搜索解决方案中的所有文件,以查找我怀疑未使用的文件的文件名.如果它没有找到,或者只在文件本身中找到,我知道它没有被使用,因为文件必须被引用(通过一个script或一个link元素,或者在一个组合并缩小它们的脚本中)被引用用过的.

当然,如果您从组件部件构建文件名,那将无法正常工作.例如,如果您的代码包含一个basename包含"foo" 的变量,然后代码输出一个脚本标记,如:

<script src="<%=basename%>-bar.js"></script>

...然后我搜索"foo-bar.js"就找不到了.如果这是在你的代码一种现实的可能性,你必须找到所有script与link元素和自己去查他们.

...或实验:部署您的解决方案,并在服务器上删除您认为可能未使用的每个文件,在浏览器上刷新,并在控制台中查找404.

...所有这些都与未使用的文件有关.如果您认为文件已被引用,但未使用其内容,则您需要有选择地删除引用并查看哪些内容(blech,手动和容易出错的过程),或者您需要进行代码覆盖率分析工具.StackOverflow上的这个问题讨论了JavaScript的代码覆盖率分析工具,Spudley的答案指向CSS的 "代码覆盖率"(缺乏更好的术语)工具.