Postcss-sanitize NPM

PostCSS Sanitize

PostCSS plugin that removes properties and values based on options (think like a CSS sanitizer).

Installation

npm install postcss-sanitize

Usage

Let's say you want to do the following things:

Remove Comic Sans as a font from your CSS
Disallow position: absolute or position: relative

Options:

removeEmpty: true,
allowedSchemes: ['http', 'https']
rules: [{
  prop: /font/gi,
  value: /Comic Sans/gi
}, {
  prop: 'position',
  value: /relative|absolute/
}]

Input:

@import(ssh://foobar.host);

.skeleton--Sans {
  color: blue;
  position: absolute;
  font-family: "Comic Sans MS";
}

.the-real-slim-shady-element {
  background-image: url(javascript:alert(42));
}

Output:

.skeleton--Sans {
  color: blue;
}

.the-real-slim-shady-element {
  background-image: url();
}

Options

removeEmpty (boolean) (Default: false): Decide if you want to CSS rules made empty by the changes
allowedSchemes: An array of URL schemes you want to allow in your CSS.
rules (array): rules
- prop (RegExp/string): the pattern or the exact string you want to match in properties
- value (RegExp/string): the pattern or the exact string you want to match in values
- Important When using both, a property/value couple have to match both the property and the value pattern to be matched and removed.

See PostCSS docs for examples for your environment.