3 ms·
> It warns on and removes any unused rules, then it minifies the result and lets you write it out to a .css file. So... is `el.classList.add('error')` going to
by reificator 9y ago
> It warns on and removes any unused rules, then it minifies the result and lets you write it out to a .css file.
So... is `el.classList.add('error')` going to do nothing if the source contains an otherwise unused error class? Is there some comment flag that prevents this behavior? Do you need to shut off the analyzer completely, or add extra hidden markup to also consume your dynamic classes?
Does it handle media queries? Or new/upcoming CSS features like the replacement for the attempted mixin standard? (:theme and... something or other...)
I'm all for finding dead rules, but if it automatically eliminates them I worry it'll be easy to accidentally trick.
- rich_harris 9y agoFor the static analyzer to work, you'd need to add that error class to the template (`<div class='{{error ? "error" : ""}}'>` or something). But that's okay — it's the whole point of state-drive UI, and happily it's much easier than manually manipulating the DOM in a way that keeps track of state. It's a feature, not a bug ;) Yep, it handles media queries. It should handle ::theme just fine (since it doesn't know what it is, it'll just ignore it), but since it's not implemented anywhere I haven't tested that yet!
- reificator 9y agoAh, that's a good point. Despite using Polymer, React, etc... for side projects, my primary browser target remains IE8 in quirks mode, so I forgot modern UI patterns for a moment. Sounds good, thanks for clarifying.