Grunt: style: 'compressed' VS cssmin

Question

I am quite new to Grunt and I am wondering why one should use grunt-contrib-cssmin instead of creating dev/dist versions like in this example:

    sass: {
        dist: {
            options: {
                style: 'compressed',
            },
            files: [{
                expand: true,
                cwd: 'assets/styles/source',
                src: [
                    '*.scss'
                ],
                dest: 'assets/styles/build',
                ext: '.min.css'
            }]
        },
        dev: {
            options: {
                style: 'extended',
            },
            files: [{
                expand: true,
                cwd: 'assets/styles/source',
                src: [
                    '*.scss'
                ],
                dest: 'assets/styles/build',
                ext: '.css'
            }]
        }           
    }

score 3 · Answer 1 · answered Apr 30 '15 at 10:37

The compress option of Sass does, see also http://sass-lang.com/documentation/file.SASS_REFERENCE.html#_16:

Compressed style takes up the minimum amount of space possible, having no whitespace except that necessary to separate selectors and a newline at the end of the file. It also includes some other minor compressions, such as choosing the smallest representation for colors. It’s not meant to be human-readable.

grunt-contribe-cssmin uses clean-css to compress AND optimize your CSS. Optimizations which Clean-css does, and Sass compress not are among others: selector & property merging, reduction, etc. (advanced optimizations), properties merging based on their order, @media` merging, restructuring optimizations and shorthand compacting

Grunt: style: 'compressed' VS cssmin

1 Answers1