Steve Klabnik

csscss parses your CSS and shows your duplicated declarations

Yesterday, a neat little gem called csscss celebrated a 1.0 release!

csscss will parse any CSS or Sass file you give it and let you know which rulesets have duplicated declarations.

It’s super easy to use:

$ gem install csscss
$ csscss path/to/styles.css path/to/other-styles.css

{.contact .content .primary} and {article, #comments} share 5 rules
{.profile-picture}, {.screenshot img} and {a.blurb img} share 4 rules
{.work h2:first-child, .archive h2:first-child, .missing h2:first-child, .about h2, .contact h2} and {body.home h2} share 4 rules
{article.blurb:hover} and {article:hover} share 3 rules

Cool! This really helps when you’re trying to get a handle on refactoring. Maybe it’s just me, but I find remembering all of my CSS rules very complicated. There’s a reason I’m more of a back-end developer…

For those who write their CSS in Sass, csscss can also parse Sass files, as well. Just point it at one and it’ll go to town!

Check out the homepage or the source on GitHub for more details.

There’s one other neat part about this gem, but it’s not for users of the gem – it’s for developers. csscss contains, as you’d expect, a full CSS parser written in parselet. I’m sure that others could do need static analysis stuff with CSS if they had a parser that was pre-built for them, as well.


Sign in or Join to comment or subscribe

0:00 / 0:00