Last active
August 29, 2015 14:23
-
-
Save jozsefs/77a5f2251d1294edf12f to your computer and use it in GitHub Desktop.
Gulpfile - Babel, watchify, livereload
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //npm install gulp gulp-connect gulp-util vinyl-source-stream vinyl-buffer lodash.assign babelify watchify browserify --save-dev | |
| var watchify = require('watchify'); | |
| var browserify = require('browserify'); | |
| var babel = require('babelify'); | |
| var gulp = require('gulp'); | |
| var connect = require('gulp-connect'); | |
| var gutil = require('gulp-util'); | |
| var source = require('vinyl-source-stream'); | |
| var buffer = require('vinyl-buffer'); | |
| var assign = require('lodash.assign'); | |
| var filesToReload = ['./index.html', './static/**/*.{css,js}'];//'./*.{html,js}'; | |
| // add custom browserify options here | |
| var customOpts = { | |
| entries: ['./src/js/app.jsx'], | |
| debug: true | |
| }; | |
| var opts = assign({}, watchify.args, customOpts); | |
| var b = watchify(browserify(opts).transform(babel)); | |
| gulp.task('js', bundle); // so you can run `gulp js` to build the file | |
| b.on('update', bundle); // on any dep update, runs the bundler | |
| b.on('log', gutil.log); // output build logs to terminal | |
| function bundle() { | |
| return b.bundle() | |
| // log errors if they happen | |
| .on('error', gutil.log.bind(gutil, 'Browserify Error')) | |
| .pipe(source('app.min.js')) | |
| // optional, remove if you don't need to buffer file contents | |
| .pipe(buffer()) | |
| // Add transformation tasks to the pipeline here. | |
| .pipe(gulp.dest('./static/js/')) | |
| } | |
| gulp.task('connect', function() { | |
| connect.server({ | |
| livereload: true | |
| }); | |
| }); | |
| gulp.task('reload', function () { | |
| gulp.src(filesToReload) | |
| .pipe(connect.reload()); | |
| }); | |
| gulp.task('watch', function () { | |
| gulp.watch([filesToReload], ['reload']); | |
| }); | |
| gulp.task('default', ['js', 'connect', 'watch']); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment