How and where to run gulp-bless for IE 9 support?

I successfully integrated gulp-bless into my workflow doing the following:

Create a CLI option which will be used to determine when to run gulp-bless. In this case I only wanted it running when the --production flag was used:

// CLI options
var enabled = {
  // Enable static asset revisioning when `--production`
  rev: argv.production,
  // Disable source maps when `--production`
  maps: !argv.production,
  // Fail styles task on error when `--production`
  failStyleTask: argv.production,
  // Fail due to JSHint warnings only when `--production`
  failJSHint: argv.production,
  // Strip debug statments from javascript when `--production`
  stripJSDebug: argv.production,
  // Split minified css when '--production'
  split: argv.production,
};

Built a bless task:

// ### Bless
gulp.task('bless', function() {
  if(enabled.split) {
    return gulp.src(path.dist + 'styles/*.css')
    .pipe(bless())
     .pipe(gulp.dest(path.dist + 'styles'));
  }
});

Finally, added the bless task to my build task:

// ### Build
// `gulp build` - Run all the build tasks but don't clean up beforehand.
// Generally you should be running `gulp` instead of `gulp build`.
gulp.task('build', function(callback) {
      runSequence('styles',
          'bless',
          'scripts',
          ['fonts', 'images'],
          callback);
});

Now my production css is blessed and IE is happy.

6 Likes