Skip to content

shrpne/postcss-clear-empty-strings

Repository files navigation

PostCSS Clear Empty Strings Build Status

PostCSS plugin remove declarations with empty values, except content property.

If you use CSS framework like Bootstrap or Uikit, you can override their variables with empty string to remove declaration which use that variable.

/* Bootstrap scss source */
h1, .h1 { font-size: $h1-font-size; }
h2, .h2 { font-size: $h2-font-size; }
h3, .h3 { font-size: $h3-font-size; }
h4, .h4 { font-size: $h4-font-size; }
h5, .h5 { font-size: $h5-font-size; }
h6, .h6 { font-size: $h6-font-size; }

/* Your scss variables */
$h1-font-size: 32px;
$h2-font-size: 24px;
$h3-font-size: 16px;
$h4-font-size: "";
$h5-font-size: "";
$h6-font-size: "";

/* css output generated from scss */
h1, .h1 { font-size: 32px; }
h2, .h2 { font-size: 24px; }
h3, .h3 { font-size: 16px; }
h4, .h4 { font-size: ""; }
h5, .h5 { font-size: ""; }
h6, .h6 { font-size: ""; }

/* postcss-clear-empty-string */
h1, .h1 { font-size: 32px; }
h2, .h2 { font-size: 24px; }
h3, .h3 { font-size: 16px; }
h4, .h4 { }
h5, .h5 { }
h6, .h6 { }

/* minify */
h1,.h1{font-size:32px}h2,.h2{font-size:24px}h3,.h3{font-size:16px}

Usage

postcss([ require('postcss-clear-empty-strings') ])

See PostCSS docs for examples for your environment.

About

Remove declarations with empty values

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published