PostCSS Analyse

IMPORTANT: This project is no longer maintained.

A PostCSS plugin which analyses property values to give developers insight into values which should be the same but may differ slightly.

Where do I start?

• How to use this tool?
• What options does it have?
• How to contribute?
• Is this project secure?
• License

How to use this tool?

These instructions are only for this plugin. See the PostCSS website for framework information.

Install

Using Yarn

yarn add postcss-analyse --exact --dev

Using NPM

npm install postcss-analyse --save-dev --save-exact

Configure

Add to your PostCSS configuration.

const Gulp = require("gulp");
const PostCSS = require("gulp-postcss");
const Analyse = require("postcss-analyse");

Gulp.task("css", () =>
    Gulp.src("./src/*.css")
        .pipe(PostCSS([Analyse()]))
        .pipe(Gulp.dest("./dest"))
);

What options does it have?

Minimal

The minimal required configuration is the prefix selector, as shown in the above example.

Analyse();

Colours

Analyse({
    maxOkColour: 50,
    maxWarningColour: 100,
});

Sizes

Analyse({
    maxOkSize: 50,
    maxWarningSize: 100,
});

How to contribute?

Read our Contributing Guide to learn more about how to contribute to this project.

Is this project secure?

Read our Security Guide to learn how security is considered during the development and operation of this plugin.

License

The MIT License is used by this project.