Gulp Recipes

Respond uses Gulp to optimize sites for deployment. This includes packaging the CSS and JS by concatenating and minifying dependencies. This works great for fast sites, but if you want to modify themes you will want to roll your own Gulp scripts to match your workflow. I have included the Gulp recipes I use below so that you can modify them for your use.

Packaging CSS

// cleanup files
gulp.task('cleanup', function() {

  var x;

  // walk through the themes
  for(x=0; x<themes.length; x++) {

    console.log(themes[x]);

    // concat css
    gulp.src([themes[x] + '/css/libs.min.css', themes[x] + '/css/plugins.css', themes[x] + '/css/site.css'])
      .pipe(concat('site.all.css'))
      .pipe(minifyCss())
      .pipe(rename('site.min.css'))
      .pipe(gulp.dest(themes[x] + '/css'));

  }

  return;

});
      

Prettify HTML

// prettify html (as needed)
gulp.task('prettify', function() {

  gulp.src('temp/**/*.html')
    .pipe(prettify({indent_size: 2}))
    .pipe(gulp.dest(themes[x]));

});