Find unused css

问题:

I'm doing some development for some pages on our internal network. I want to know if there's an open source tool or FF plugin which can identify unused css within a project.

I've looked at using this, but when I try to install the Add-on Installer says "Not compatible with Firefox 3.6"

https://addons.mozilla.org/en-US/firefox/addon/dust-me-selectors/

Please note, this is for an intranet - not a www visible website - so I can't use the online sites which offer such services.

回答1:

I've been looking for a while, and the best thing I found was this:

http://unused-css.com/

They scan your site and email you the result css.

I am aware you are working on a localsite, however if you find no alternative, you can upload your site somewhere and use this

Alternatively

You could install a previous version of firefox that is compatible with dust-me selectors and run it along side your current installation of firefox.

回答2:

Google Chrome (and therefore probably Safari as well) have the developer tools installed, which come with Audits. When you audit the page, the unused CSS rules is one thing it checks.

Here's what it looks like on this page.

回答3:

I have CSS Usage installed in FF. But barely used it once. It searches for un-used CSS on the current page, not the whole project though.

回答4:

dust-me-selectors Firefox addon is now compatible with Firefox 16...

回答5:

Is it possible to combine all of your HTML pages together into one single page, for example using:

type *.htm > all-pages.htm

Then you could run Firefox/CSS Usage on this single, 'super' page?

回答6:

There is a new program at sourceforge called CSS Scanner, it scans for used and unused css classes and stylesheets in html, aspx, php, javascript and jquery code. It's .net code so you'll need Windows: http://sourceforge.net/projects/cssscanner/

回答7:

1. Chrome addon, which generate stylesheet of css rules effectively used in a page, can be tried for the quick results..here is the link

   https://chrome.google.com/webstore/detail/css-remove-and-combine/cdfmaaeapjmacolkojefhfollmphonoh It also gives summary about the rules, which are not been used.

2. And this one involves grunt and related plugins to find unused code http://addyosmani.com/blog/removing-unused-css/

回答8:

If you are familiar with node js you can also use "find unused css": https://www.npmjs.com/package/find-unused-css