1.0.1 • Published 6 years ago
postcss-only-one-root v1.0.1
Postcss only one :root
A PostCSS plugin to remove all instances of “:root” but one from a stylesheet.
This plugin is very basic. It removes all instances of :root
except for the first it encounters from a processed stylesheet (if present). I built this as I used automatical localised imports for my Webpack scss files, which occured in duplicate references to the :root selector variables.
Otherwise, you probably have no use for this plugin. You should run this plugin after running postcss-custom-properties
Installation
npm install --save postcss-only-one-root
Example
variables.scss
:root {
--color-blue: blue;
}
file.a.scss
@import "./variables";
.something-1 {
color: var(--color-blue);
}
file.b.scss
@import "./variables";
.something-2 {
color: var(--color-blue);
}
Output
:root {
color-blue: blue
}
.something-1 {
color: blue;
color: var(--color-blue);
}
.something-2 {
color:blue;
color: var(--color-blue);
}
Usage
See the PostCSS documentation for examples on how to use this plugin in different environments. This plugin takes no options.