kalashnikovvv
11/1/2016 - 4:14 PM

Gulpfile for Rails application with replaced Sprockets with Gulp

Gulpfile for Rails application with replaced Sprockets with Gulp

'use strict'

var gulp, sass, babelify, browserify, watchify, source, util;

gulp       = require('gulp');
sass       = require('gulp-sass');
babelify   = require('babelify')
browserify = require('browserify');
watchify   = require('watchify');
source     = require('vinyl-source-stream');
util       = require('gulp-util');

var sassPath, sassSource, jsSource;

sassPath   = './app/assets/stylesheets/**/*.sass';
sassSource = ['./app/assets/stylesheets/application.sass'];
jsSource   =  './app/assets/javascripts/app.js';

function compile(watch) {
  var bundler = watchify(browserify({entries: jsSource, debug: true}).transform(babelify));

  function bundle() {
    bundler.bundle()
      .on('error', util.log.bind(util, "Browserify Error"))
      .pipe(source('build.js'))
      .pipe(gulp.dest('./public/assets'))
  }

  if (watch) {
    bundler.on('update', function(){
      console.log("Recompiling JS...");
      bundle();
    });
  }

  bundle();
}

gulp.task('default', ['compile-sass', 'compile-es6']);

gulp.task('compile-sass', function() {
  gulp.src(sassSource)
    .pipe(sass({ indentedSyntax: true, errLogToConsole: true }))
    .pipe(gulp.dest('public/stylesheets'))
});

gulp.task('compile-es6', function() {
  compile();
});

gulp.task('watch', ['watch-sass', 'watch-es6']);

gulp.task('watch-sass', function() {
  gulp.watch(sassPath, ['compile-sass']);
});

gulp.task('watch-es6', function() {
  compile(true)
});