Una confguracion minima para trabajar con sass y jade y algunas extensiones de postcss usando gulp

gulpfile.js

/*
Gulpfile.js file for the tutorial:
Using Gulp, SASS and Browser-Sync for your front end web development - DESIGNfromWITHIN
http://designfromwithin.com/blog/gulp-sass-browser-sync-front-end-dev
Steps:
1. Install gulp globally:
npm install --global gulp
2. Type the following after navigating in your project folder:
npm install gulp gulp-util gulp-sass gulp-uglify gulp-rename gulp-minify-css gulp-notify gulp-concat gulp-plumber browser-sync --save-dev
3. Move this file in your project folder
4. Setup your vhosts or just use static server (see 'Prepare Browser-sync for localhost' below)
5. Type 'Gulp' and ster developing
*/

/* Needed gulp config */
var gulp = require('gulp');  
var sass = require('gulp-sass');
var rename = require('gulp-rename');
var minifycss = require('gulp-minify-css');
var plumber = require('gulp-plumber');
var browserSync = require('browser-sync');
var reload = browserSync.reload;
var jade = require("gulp-jade");
var postcss = require("gulp-postcss");
var autoprefixer = require("gulp-autoprefixer");
var rucksack = require("gulp-rucksack");
var gshort = require("postcss-short");

/* Sass task */
gulp.task('sass', function () {  
    gulp.src('scss/style.scss')
    .pipe(plumber())
    .pipe(sass({
        includePaths: ['scss']
    }))
    .pipe(autoprefixer())
    .pipe(postcss(
          [
          autoprefixer,
          rucksack,
          gshort(),
          require("postcss-font-magician")()
    ]))
    .pipe(gulp.dest('css'))
    .pipe(rename({suffix: '.min'}))
    .pipe(minifycss())
    .pipe(gulp.dest('css'))
    /* Reload the browser CSS after every change */
    .pipe(reload({stream:true}));
});

/* Jade task */
gulp.task('jade', function(){
  gulp.src('templates/*.jade')
    .pipe(jade())
    .pipe(gulp.dest("./"));
});


/* Reload task */
gulp.task('bs-reload', function () {
    browserSync.reload();
});

/* Prepare Browser-sync for localhost */
gulp.task('browser-sync', function() {
    browserSync.init(['css/*.css', 'templates/*.jade'], {
        /*
        I like to use a vhost, WAMP guide: https://www.kristengrote.com/blog/articles/how-to-set-up-virtual-hosts-using-wamp, XAMP guide: http://sawmac.com/xampp/virtualhosts/
        */
        //proxy: 'your_dev_site.url'
        /* For a static server you would use this: */
        
        server: {
            baseDir: './'
        }
       
    });
});

/* Watch scss, js and html files, doing different things with each. */
gulp.task('default', ['sass','jade', 'browser-sync'], function () {
    /* Watch scss, run the sass task on change. */
    gulp.watch(['scss/*.scss', 'scss/**/*.scss'], ['sass'])
    /* Watch app.js file, run the scripts task on change. */
    gulp.watch(['templates/*.jade'], ['jade'])
    /* Watch .html files, run the bs-reload task on change. */
    gulp.watch(['*.html'], ['bs-reload']);
});

installer.js

//Crea la estructura de carpetas necesarias.
var fs = require("fs"),
    spawn = require("child_process").spawn;

["css/","scss/","templates/", "fonts/"].forEach(function(folder){
  if (!fs.existsSync("./"+folder))
    fs.mkdirSync("./"+folder);
});

console.log("Ok viejo tomate un cafecito que esto tarda un toque en descargar..." );
var instala_modulos = spawn('npm', ["install"]);
instala_modulos.on('close', function(code){console.log("Copado, ya esta todo el circo armado :)");});

package.json

{
  "name": "code",
  "version": "1.0.0",
  "description": "",
  "main": "gulpfile.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "browser-sync": "^2.11.1",
    "gulp": "^3.9.1",
    "gulp-autoprefixer": "^3.1.0",
    "gulp-jade": "^1.1.0",
    "gulp-minify-css": "^1.2.4",
    "gulp-plumber": "^1.1.0",
    "gulp-postcss": "^6.1.0",
    "gulp-rename": "^1.2.2",
    "gulp-rucksack": "^0.1.2",
    "gulp-sass": "^2.2.0",
    "postcss-font-magician": "^1.4.0",
    "postcss-short": "^1.4.0"
  }
}