Gulpfile for browserify+watchify+react+browser-sync

gulpfile.js

var gutil = require('gulp-util');
var gulp = require("gulp");
var browserify = require("browserify");
var babelify = require('babelify');
var reactify = require('reactify');
var watchify = require('watchify');
var source = require('vinyl-source-stream');
var browserSync = require('browser-sync');

var bundler = watchify(browserify({
  entries: './src/js/main.jsx',
  extensions: ['.jsx'],
  debug: true
}, watchify.args));

// bundler.transform(reactify);
bundler.transform(babelify);

bundler.on('update', bundle);

function bundle() {
  gutil.log('Compilando js...');

  return bundler.bundle()
    .on('error', function (err) {
      gutil.log(err.message);
      browserSync.notify("browserify Error!");
      this.emit("end");
    })
    .pipe(source('main.js'))
    .pipe(gulp.dest('./dist/js'))
    .pipe(browserSync.reload({stream: true, once: true}));
}

gulp.task('bundle', function() {
  return bundle();
});

// this was for the outdated course that I'm not willing to pay. Moving to another tutorial :x
gulp.task('copy', function() {
  gulp.src('src/index.html')
    .pipe(gulp.dest('dist'))
    .pipe(browserSync.reload({stream: true, once: true}));
  gulp.src('src/assets/**/*.*')
    .pipe(gulp.dest('dist/assets'))
    .pipe(browserSync.reload({stream: true, once: true}));
});

gulp.task('default',['bundle', 'copy'], function() {
  browserSync({
    server: "./dist",
    open: false
  });
});