Skip to content

Instantly share code, notes, and snippets.

@andrew-dixon
Last active August 29, 2015 14:04
Show Gist options
  • Save andrew-dixon/1d9e820e70b05d800bf0 to your computer and use it in GitHub Desktop.
Save andrew-dixon/1d9e820e70b05d800bf0 to your computer and use it in GitHub Desktop.
// Include require nodejs modules
var gulp = require('gulp');
var gutil = require('gulp-util');
var concat = require('gulp-concat');
var less = require('gulp-less');
var compressor = require('gulp-compressor');
// Define paths
var paths = {
lessFile: 'includes/css/styles.less',
lessFiles: 'includes/css/*.less',
cssDir: 'includes/css',
cssFiles: 'includes/css/*.css',
minDir: 'includes/min'
};
gulp.task('css', ['less'], function() {
// Minify and copy all CSS
return gulp.src(paths.cssFiles)
.pipe(compressor())
.pipe(concat('styles.min.css'))
.on('error', gutil.log)
.pipe(gulp.dest(paths.minDir));
});
gulp.task('less', function () {
// Compile less into CSS
return gulp.src(paths.lessFile)
.pipe(less())
.on('error', gutil.log)
.pipe(gulp.dest(paths.cssDir));
});
// Rerun the task when a file changes
gulp.task('watch', function() {
gulp.watch(paths.lessFiles, ['css']);
});
// The default task (called when you run `gulp` from cli)
gulp.task('default', ['css']);
@andrew-dixon
Copy link
Author

This gulpfile.js allows you to compile less into CSS and then minify the CSS. The task "css" minifies the CSS and is dependant on the completion of the "less" task, as specified by the hint telling it that it is dependant on the "less" task:

gulp.task('css', ['less'], function() {

Where the ['less'] is the hint.

Also the:

.on('error', gutil.log)

Causes the watch task to not error out and stop watching if there is an error in the less file(s) you pass into it. Instead the error is output to the console and the tasks continues to watch.

@webRat
Copy link

webRat commented Jul 18, 2014

You can take out 'less' on line #36 -- 'css' runs and has a dependency of 'less'. Same for #line 40.

@andrew-dixon
Copy link
Author

Thanks Todd so it does. Updated as suggested.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment