Skip to content

Instantly share code, notes, and snippets.

@voter101
Last active November 29, 2021 01:17
Show Gist options
  • Star 34 You must be signed in to star a gist
  • Fork 6 You must be signed in to fork a gist
  • Save voter101/9c824a30f712e7724cad to your computer and use it in GitHub Desktop.
Save voter101/9c824a30f712e7724cad to your computer and use it in GitHub Desktop.
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
Copy link

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