grunt-csscss

Grunt task that executes CSSCSS.

grunt-csscss

Grunt task that runs CSSCSS, a CSS redundancy analyzer.

CSSCSS runs on Ruby (v1.9.x and up), to check Ruby is installed on your machine use ruby -v. To install the CSSCSS gem run gem install csscss command, this will grab the latest version.

Currently grunt-csscss handles all the features for CSSCSS that are available with version 1.3.1.

This plugin requires Grunt ~0.4.0

If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:

npm install grunt-csscss --save-dev

Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:

grunt.loadNpmTasks('grunt-csscss');

Type: Boolean Default: false

Run CSSCSS with bundle exec.

Type: Boolean Default: true

Flag indicating whether the outputted analysis should be colorized.

Type: Boolean Default: false

Enables Compass extensions when parsing Sass.

Compass must be installed in order to use this option.

Type: Boolean Default: false

Flag indicating whether the Grunt task should fail when rule sets with duplicate declarations are found by CSSCSS.

Type: String

Comma seperated list of CSS properties that should be ignored when finding matches.

Type: Boolean Default: false

Flag indicating whether matches in Sass mixins should be ignored.

This is an experimental feature.

Type: String

Comma seperated list of selectors that should be ignored when finding matches.

Type: Number Default: 3

Only report matches that have at least this many matching rules.

Type: Boolean Default: false

Output analysis in JSON format.

Type: Boolean Default: true

Whether shorthand CSS declaration should be parsed. Check here for a great explanation of this option.

Type: Boolean Default: false

Outputs parser errors.

Type: string

Path to a ruby file that is loaded before running CSSCSS.

Compass must be installed in order to use this option.

Type: Boolean Default: false

Displays the CSS properties that have been matched.

Basic example of a Grunt config containing the CSSCSS task.

grunt.initConfig({
  csscss: {
    dist: {
      src: ['css/style.css']
    }
  }
});
 
grunt.loadNpmTasks('grunt-csscss');
 
grunt.registerTask('default', ['csscss']);

Running CSSCSS against multiple CSS files. All the files specified in the src array will be analyzed by CSSCSS.

csscss: {
  dist: {
    src: ['css/style.css', 'css/another.css']
  }
}

Example of using the options.

csscss: {
  options: {
    colorize: false,
    verbose: true,
    outputJson: false,
    minMatch: 2,
    compass: true,
    ignoreProperties: 'padding',
    ignoreSelectors: '.rule-a'
  },
  dist: {
    src: ['css/style.css', 'css/another.css']
  }
}

Example of using CSSCSS to analyze Sass files that are converted using Compass.

csscss: {
  options: {
    require: 'my/config/file.rb'
  },
  dist: {
    src: ['sass/style.scss']
  }
}

Example of using a glob pattern to target many files that should be analysed by CSSCSS. The example below will analyse all the files in the css directory that have an extension of .css.

csscss: {
  dist: {
    src: ['css/*.css']
  }
}

Example of using the Grunt task to output the analysis from CSSCSS to a local file. The example below will create (if necessary) output.json file, where it will write the output from CSSCSS. If the outputJson property is set to true (like in the example below) then valid JSON will be written to the file.

csscss: {
  dist: {
    options: {
      outputJson: true
    },
    files: {
      'output.json': ['css/style.css']
    }
  }
}

See CHANGELOG.

All credit goes to Zach Moazeni for his brilliant work on CSSCSS, great job Zach!