Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Base gulpfile config for babel, browserify, and uglify - with sourcemaps and livereload
var gulp = require('gulp');
var browserify = require('browserify');
var babelify = require('babelify');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var uglify = require('gulp-uglify');
var sourcemaps = require('gulp-sourcemaps');
var livereload = require('gulp-livereload');
gulp.task('build', function () {
// app.js is your main JS file with all your module inclusions
return browserify({entries: './src/js/app.js', debug: true})
.transform("babelify", { presets: ["es2015"] })
.bundle()
.pipe(source('app.js'))
.pipe(buffer())
.pipe(sourcemaps.init())
.pipe(uglify())
.pipe(sourcemaps.write('./maps'))
.pipe(gulp.dest('./dist/js'))
.pipe(livereload());
});
gulp.task('watch', ['build'], function () {
livereload.listen();
gulp.watch('./src/js/*.js', ['build']);
});
gulp.task('default', ['watch']);
npm install --save-dev babel-preset-es2015 babelify browserify vinyl-source-stream vinyl-buffer gulp-uglify gulp-sourcemaps gulp-livereload
@alkrauss48

This comment has been minimized.

Copy link
Owner Author

alkrauss48 commented Nov 4, 2015

So that you can write ES6 code in the browser! Just run the command in shell-install.sh to install all the dependencies.

@lawrencejones

This comment has been minimized.

Copy link

lawrencejones commented Feb 15, 2016

Appreciated!

@colepacak

This comment has been minimized.

Copy link

colepacak commented Jun 9, 2016

Thanks so much. FYI - I had to remove uglify to get the sourcemaps to work.

@menonsamir

This comment has been minimized.

Copy link

menonsamir commented Jul 10, 2016

Thanks! BTW, I needed to use sourcemaps.init({loadMaps: true}) for source maps to get loaded correctly.

@stsvilik

This comment has been minimized.

Copy link

stsvilik commented Aug 1, 2016

For me it produced sourcemaps that did not map correctly to the source

@avitevet

This comment has been minimized.

Copy link

avitevet commented Oct 19, 2016

Thanks! I needed to add the buffer() call to get past a "Streaming not supported" error from gulp-uglify.

@alex1012

This comment has been minimized.

Copy link

alex1012 commented Dec 23, 2016

Hi guys! What node version must be installed in my machine for support this gulp modules?

@Jayadev6191

This comment has been minimized.

Copy link

Jayadev6191 commented Mar 23, 2017

@alex1012 Works fine with node v7.7.2

@Zulcom

This comment has been minimized.

Copy link

Zulcom commented May 19, 2018

babel-preset-es2015 depricated

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.