Outil pour parsingr et comparer deux feuilles de style CSS

Est-ce que quelqu’un connaît un bon outil qui peut parsingr et comparer deux feuilles de style CSS afin de trouver quels sélecteurs ont des styles différents?

Je ne peux pas utiliser un outil de type diff standard car les deux fichiers CSS ont une disposition très différente. J’ai besoin d’un outil capable d’parsingr et de comprendre le CSS, puis de rechercher des sélecteurs ayant des styles différents dans les deux feuilles de style.

Le seul outil que j’ai trouvé est le CSS Comparer d’Alan Hart , mais il devient confus quand il y a des styles qui s’appliquent à plusieurs sélecteurs.

Voici ce que j’ai fini par faire, au cas où quelqu’un d’autre aurait le même problème:

  1. J’ai utilisé CSSTidy pour “normaliser” les deux feuilles de style que je souhaitais comparer. La normalisation dans mon cas impliquait la division de plusieurs sélecteurs et sélecteurs et propriétés de sorting. Une version en ligne de CSSTidy est disponible ici .
  2. Après cela, j’ai utilisé l’ outil CSS Comparer d’Alan Hart pour découvrir les différences entre les deux feuilles de style.

Cela a fait le travail pour mes besoins spécifiques.

J’ai essayé d’utiliser CSS Compare . Il semble faire exactement ce que vous recherchez. Cependant, il semble avoir des problèmes avec plusieurs sélecteurs. La partie intéressante est qu’elle est pilotée par ligne de commande, vous pouvez donc configurer un processus automatisé si vous avez beaucoup de fichiers CSS, ou vous pouvez enchaîner les fichiers CSS pour les comparer à un fichier SASS résultant géant. Cet outil vous montrera toutes les différences, y compris les différences dans les valeurs des classes.

Ce qui serait vraiment bien si un outil vous montrait quels styles remplaçaient les autres styles de la même feuille de style. Beaucoup d’anciens sites ont beaucoup de bagages de cette façon et le filtrer serait génial. Bien sûr, un outil automatisé peut causer des problèmes, mais au moins quelque chose qui génère un rapport comme Firebug, sauf pour chaque sélecteur et pour la collection entière de fichiers CSS, serait génial. Malheureusement, CSS Compare n’est pas un tel outil, et je n’en connais pas un 🙁

Je chargerais la page Web en utilisant une feuille de style dans un onglet et une autre dans une autre. Ensuite, utilisez l’inspecteur ou le firebug pour vérifier le style des nœuds pertinents.

C’est très manuel, évidemment, mais ce que vous demandez, c’est un sacré pareil pour un processus cassé que vous ne trouverez probablement pas beaucoup d’aide.

Si vous avez une certaine expérience de la programmation, vous pourriez probablement écrire vous-même un parsingur assez simple qui rapporte chaque classe définie et son style. Cependant, c’est probablement plus de travail que cela en vaut la peine.

Faites-le manuellement une fois, puis résolvez le problème en vous déplaçant vers SASS ( http://sass-lang.com/ ) et en améliorant l’organisation de vos sites Web.