Inutilisés css - comment voulez-vous nettoyer?

probablement n'importe quel développeur web expérimenté serait familier avec ce problème: au fil du temps, vos fichiers css peuvent devenir assez énormes et laids à cause de tous les sélecteurs plus utilisés, ce qui pourrait être assez difficile à trouver. Je travaille sur un projet de rails où nous avons tendance à re-concevoir les choses assez fréquemment, ce qui conduit à une tonne de CSS de port en lourd. Quelle est la meilleure façon de trouver et de supprimer?

maintenant, je sais qu'il y a un plugin rails appelé deadweight construit spécifiquement pour cela but. Cependant, voici mon problème avec deadweight: tout d'abord, il ignore complètement les sélecteurs utilisés dans javascript. Ensuite, il ne scanne que les pages que vous avez configurées pour les numériser, ce qui signifie qu'il y a un risque de supprimer quelque chose qui est utilisé sur les pages que vous n'avez pas numérisées pour une raison quelconque. Enfin, il ne trouve les sélecteurs inutilisés que dans les css compilés (nous utilisons moins) - les comparer avec le code réel est un peu trop impliqué.

j'ai aussi essayé http://unused-css.com/ - ils sont super, mais ne peuvent pas accéder à localhost et, encore une fois, ne peuvent scanner que les CSS compilés.

je pense vraiment qu'il doit y avoir une meilleure façon de le faire. En fait, il y a quelque temps, j'ai décidé d'optimiser un fichier css particulier en greppant chaque sélecteur dans l'ensemble du répertoire du projet (le mode emacs + rinari le rend super-facile et super-rapide), et chaque fois que je n'ai pas vu de html ou de css dans les résultats, j'ai supprimé le style. Zéro problème, ça a fonctionné comme un charme. Évidemment, je ne vais pas faire ça pour l'ensemble du site. Cependant, je ne crois vraiment pas que cela ne puisse pas être automatisé. Avant que j'allume mon python et que je code ça, est-ce que quelqu'un peut me dire si je réinvente la roue?

21
demandé sur Konstantin K 2012-05-24 22:34:43

2 réponses

découvrez uCSS library de Opera Software.

il vous aide à trouver les CSS non utilisés, ainsi que les CSS dupliqués. Aussi, vous pouvez obtenir un aperçu de combien de fois chaque règle a été utilisé dans votre balisage. Plusieurs options sont disponibles en configurant un fichier de configuration.

mise à Jour:

une Autre excellente alternative: csscss.

écrit en rubis et supporte SASS, moins.

mise à Jour:

une Autre excellente alternative: uncss.

il fonctionne à travers plusieurs fichiers et supporte les CSS injectés par Javascript.

13
répondu NARKOZ 2014-04-16 16:02:27

La Poussière Me Selecters et/ou CSS Usage les extensions Firefox peuvent vous aider à éliminer les CSS inutilisés.

dans les outils de développement de Chrome, vous pouvez utiliser L'outil de Performance de Page Web pour trouver les règles CSS inutilisées.

2
répondu John Conde 2012-05-24 18:36:44