Here's a simple gulpfile.js I'm using on a very simple project which basically consists of an animation built with Sass, SVG and very little JS.

var gulp = require('gulp'),
    usemin = require('gulp-usemin'),
    rimraf = require('gulp-rimraf'),
    sass = require('gulp-sass'),
    prefix = require('gulp-autoprefixer'),
    minifyCSS = require('gulp-minify-css'),
    // minifyHTML = require('gulp-minify-html'), // messes up the SVG
    uglify = require('gulp-uglify'),
    watch = require('gulp-watch'),
    livereload = require('gulp-livereload');

gulp.task('rimraf', function() {
  return gulp.src('./dist', { read: false })

gulp.task('sass', function() {
    return gulp.src('app/sass/**/*.scss')
        .pipe(prefix('> 1%')) // this could be on usemin (to also prefix css files from index.html), but doesn't seem to work

gulp.task('usemin', function() {
        css: [
            // prefix('> 1%') // doesnt work
        html: [
            // minifyHTML()
        js: [

// For production
gulp.task('default', ['rimraf', 'sass'], function(){

// Watch SASS and keep CSS updated and auto-prefixed (for development)
gulp.task('watch-sass', function () {
        .pipe(watch(function(files) {
            return files.pipe(sass())
                .pipe(prefix('> 1%'))

I'm not a back-end person and gulp is brand new to me, so I'd like to have some feedback on it. In addition, I had some problems regarding the autoprefixer, which you can see in the comments.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.