Skip to content

Instantly share code, notes, and snippets.

@jenofdoom
Created January 7, 2016 02:28
Show Gist options
  • Save jenofdoom/ce04e6daa6f7d90af2be to your computer and use it in GitHub Desktop.
Save jenofdoom/ce04e6daa6f7d90af2be to your computer and use it in GitHub Desktop.
gulp-scss-compile
// Include gulp
var gulp = require('gulp');
// Polyfill so we don't need >= node 0.12
require('es6-promise').polyfill();
// Include plugins
var sass = require('gulp-sass');
var minifyCSS = require('gulp-minify-css');
var autoprefixer = require('gulp-autoprefixer');
var bless = require('gulp-bless');
// Turn sass into css, prefix, minify and bless
gulp.task('scss', function () {
return gulp.src('scss/**/*.scss')
.pipe(sass().on('error', sass.logError))
.pipe(autoprefixer({
browsers: ['last 4 versions'],
cascade: false,
remove: false // set this to true if parsing library or legacy css code
}))
.pipe(minifyCSS())
.pipe(bless())
.pipe(gulp.dest('css/'));
});
// Watch files for changes
gulp.task('watch', function() {
gulp.watch('scss/**/*.scss', ['scss']);
});
// Default task (recompile on init before watching)
gulp.task('default', ['scss', 'watch']);
{
"name": "<your-project-name>",
"version": "1.0.0",
"description": "Compiles SASS files into CSS, minifies and blesses them.",
"main": "gulpfile.js",
"repository": "<your-repo-goes-here>",
"devDependencies": {
"gulp": "^3.9.0",
"gulp-minify-css": "^1.1.6",
"gulp-sass": "^2.0.1",
"gulp-bless": "^3.0.1",
"gulp-autoprefixer": "^3.0.1",
"es6-promise": "^3.0.2"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment