Create a gist now

Instantly share code, notes, and snippets.

Embed
What would you like to do?
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)
});
@murphyryan1

This comment has been minimized.

Show comment
Hide comment
@murphyryan1

murphyryan1 Apr 28, 2017

Hey, just wondering which gems I should use to implement this in my application?

Hey, just wondering which gems I should use to implement this in my application?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment