Gulp plugin which splits CSS files suitably for Internet Explorer < 10.
This is the a Gulp wrapper around bless.js (see blesscss.com).
npminstallgulp-blessvargulp=require('gulp');varbless=require('gulp-bless');gulp.task('css',function(){gulp.src('style.css').pipe(bless()).pipe(gulp.dest('./splitCSS'));});gulp.task('default',['watch']);// Rerun the task when a file changesgulp.task('watch',function(){gulp.watch('./css/*.css',['css']);});imports- A boolean (which defaults totrue). Determines whether or not the first chunk / "blessed" file@imports the others.cacheBuster- A boolean (which defaults totrue). Ifimportsistrue, this will add a random query parameter value to prevent against aggressive caching.log- A boolean (which defaults tofalse). Logs a small bit of information about the process.suffix- Either a string or a function (which defaults to"-blessed").- If it is a string then it will be appended to the original file name before the index. E.g.
//Assume you have long.css that is to be splitted into 3 parts, following code will //produce 3 files: long.css, long-part1.css, long-part2.css gulp.src('long.css').pipe(bless{suffix: '-part'}).pipe(gulp.dest('./'));
- If it is a function then whatever returned by the function is appended to the original file name. The function takes in a 1-based index E.g.
//Assume you have long.css that is to be splitted into 3 parts, following code will //produce 3 files: long.css, long-functionpart1.css, long-functionpart2.cssgulp.src('long.css').pipe(bless{suffix: function(index){return"-functionpart"+index;}}).pipe(gulp.dest('./'));
Example:
gulp.src('long.css').pipe(bless({imports: false})).pipe(gulp.dest('./'))You should minify your CSS after it goes through gulp-bless. See BlessCSS/bless#90 as to why.
Yes. This can be used with gulp-sourcemaps.
- Adam Lynch (@adam-lynch) (Creator)
- Alvin Lin (@alvinlin123)