grunt-bless

A grunt module for Blessing your CSS files so they will work in Internet Explorer. This is based on a pull request by Aki Alexandra Nofftz (@akinofftz).

Getting Started

This plugin requires Grunt ~0.4.1

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-bless --save-dev

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

grunt.loadNpmTasks('grunt-bless');

The "bless" task

Overview

In your project's Gruntfile, add a section named bless to the data object passed into grunt.initConfig().

grunt.initConfig({
  bless: {
    css: {
      options: {
        // Task-specific options go here.
      },
      your_target: {
        // Target-specific file lists and/or options go here.
      }
    }
  }
})

Options

options.banner

Type: String Default value: undefined

Add a banner followed by a new line to the top of the main file, the one that you will include in your source.

  options: {
    banner: '/* this is a banner */'
  }

options.compress

Type: Boolean Default value: false

Compress the css output added by bless. This does not compress the CSS you wrote. For that you should try the cssmin plugin.

options.cleanup

Type: Boolean Default value: true

Clean up files generated by bless before proceeding.

options.force

Type: Boolean Default value: false if grunt --force flag is not set

Override the Grunt option for this task. This will allow bless to overwrite the input file.

options.imports

Type: Boolean Default value: true

Enable or disable the use of @import in generated CSS files. This feature was added in bless.js 3.0.3.

options.cacheBuster

Type: Boolean Default value: true

Add or remove a cache-buster parameter from the generated CSS files.

Usage Examples

Default Options

The default options will split the files and add a cache-buster parameter. Just as the defaults for blessc are.

grunt.initConfig({
  bless: {
    css: {
      options: {},
      files: {
        'tmp/above-limit.css': 'test/input/above-limit.css'
      }
    }
  }
})

Custom Options

You can set any option allowed by bless.

grunt.initConfig({
  bless: {
    css: {
      options: {
        cacheBuster: false,
        compress: true
      },
      files: {
        'tmp/below-limit.css': 'test/input/below-limit.css'
      }
    }
  }
})

Contributing

In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code using Grunt.

Release History

• Next
  • Updated documentation to note the newness of the not yet released to npm imports option, thanks @spoike
  • Added a banner option to avoid banners getting misplaced in the blessing process. thanks @jelmerdemaat
  • Added implementation for the force option.
• 0.1.1 Fatal documentation flaw, no actual code changes, thanks @codecollision
• 0.1.0 Initial release, courtesy of Aki Alexandra Nofftz