////////////////////////////////
// Requires
////////////////////////////////
var gulp = require('gulp'),
    pjson = require('./package.json'),
    gutil = require('gulp-util'),
    sass = require('gulp-sass'),
    autoprefixer = require('gulp-autoprefixer'),
    cssnano = require('gulp-cssnano'),
    rename = require('gulp-rename'),
    del = require('del'),
    plumber = require('gulp-plumber'),
    pixrem = require('gulp-pixrem'),
    uglify = require('gulp-uglify'),
    imagemin = require('gulp-imagemin'),
    exec = require('gulp-exec'),
    runSequence = require('run-sequence'),
    browserSync = require('browser-sync');

////////////////////////////////
// Relative paths function
////////////////////////////////
var pathsConfig = function (appName) {
    this.app = "./" + (appName || pjson.name);

    return {
        app: this.app,
        templates: this.app + '/templates',
        css: this.app + '/static/css',
        sass: this.app + '/static/sass',
        fonts: this.app + '/static/fonts',
        images: this.app + '/static/images',
        js: this.app + '/static/js',
    }
};

var paths = pathsConfig();

////////////////////////////////
// Styles autoprefixing and minification
////////////////////////////////
gulp.task('styles', function() {
    return gulp.src(paths.sass + '/project.scss')
        .pipe(sass().on('error', sass.logError))
        .pipe(plumber()) // Checks for errors
        .pipe(autoprefixer({browsers: ['last 2 version']})) // Adds vendor prefixes
        .pipe(pixrem())  // add fallbacks for rem units
        .pipe(gulp.dest(paths.css))
        .pipe(rename({ suffix: '.min' }))
        .pipe(cssnano()) // Minifies the result
        .pipe(gulp.dest(paths.css));
});

////////////////////////////////
// Javascript minification
////////////////////////////////
gulp.task('scripts', function() {
    return gulp.src(paths.js + '/project.js')
        .pipe(plumber()) // Checks for errors
        .pipe(uglify()) // Minifies the js
        .pipe(rename({ suffix: '.min' }))
        .pipe(gulp.dest(paths.js));
});

////////////////////////////////
// Image compression
////////////////////////////////
gulp.task('imgCompression', function(){
    return gulp.src(paths.images + '/*')
        .pipe(imagemin()) // Compresses PNG, JPEG, GIF and SVG images
        .pipe(gulp.dest(paths.images))
});

////////////////////////////////
// Run django server
////////////////////////////////
gulp.task('runServer', function() {
    exec('python manage.py runserver', function (err, stdout, stderr) {
        console.log(stdout);
        console.log(stderr);
    });
});

////////////////////////////////
// Browser sync server for live reload
////////////////////////////////
gulp.task('browserSync', function() {
    browserSync.init(
        [paths.css + "/*.css", paths.js + "*.js", paths.templates + '*.html'], {
        // proxy:  "localhost:8000" => Esta URL es la default
        proxy:  "http://192.168.99.100:8000/"
        // => La URL que se usa en Mac
    });
});

////////////////////////////////
// Default task
////////////////////////////////
gulp.task('default', function() {
    runSequence(['styles', 'scripts'], 'runServer', 'browserSync');
});

////////////////////////////////
// Watch
////////////////////////////////
gulp.task('watch', ['default'], function() {
    gulp.watch(paths.sass + '/**/*.scss', ['styles']);
    gulp.watch(paths.js + '/**/*.js', ['scripts']);
    gulp.watch(paths.images + '/**/*', ['imgCompression']);
    gulp.watch('templates/**/*.html');
});
@@ -3539,12 +3539,332 @@
 .html');%0A%7D);
+%0A%0A%0A'use strict';%0A%0Agulp.task('sass', function () %7B%0A%09this.app = %22./%22 + pjson.name;%0A  return gulp.src(this.app + '/static/sass/**/*.scss')%0A    .pipe(sass().on('error', sass.logError))%0A    .pipe(gulp.dest(this.app + '/static/css'));%0A%7D);%0A%0Agulp.task('sass:watch', function () %7B%0A  gulp.watch('./sass/**/*.scss', %5B'sass'%5D);%0A%7D);%0A

Add gulp task to generate css: gulp sass