-
Notifications
You must be signed in to change notification settings - Fork 3
/
gulpfile.js
80 lines (71 loc) · 2.54 KB
/
gulpfile.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
// From http://jpsierens.com/tutorial-gulp-javascript-2015-react/
var gulp = require('gulp');
var browserify = require('browserify');
var source = require('vinyl-source-stream');
var gutil = require('gulp-util');
var babelify = require('babelify');
var connect = require('gulp-connect');
// External dependencies you do not want to rebundle while developing,
// but include in your application deployment
var dependencies = [
// 'react',
// 'react-dom'
// 'react-proxes-components'
];
// keep a count of the times a task refires
var scriptsCount = 0;
// Gulp tasks
// ----------------------------------------------------------------------------
gulp.task('scripts', function () {
bundleApp(false);
});
gulp.task('deploy', function (){
bundleApp(true);
});
gulp.task('watch', function () {
gulp.watch(['./src/scripts/**/*.js'], ['scripts']);
});
// When running 'gulp' on the terminal this task will fire.
// It will start watching for changes in every .js file.
// If there's a change, the task 'scripts' defined above will fire.
gulp.task('default', ['scripts','watch']);
// Private Functions
// ----------------------------------------------------------------------------
function bundleApp(isProduction) {
scriptsCount++;
// Browserify will bundle all our js files together in to one and will let
// us use modules in the front end.
var appBundler = browserify({
entries: './src/scripts/app.js',
debug: true
});
// If it's not for production, a separate vendors.js file will be created
// the first time gulp is run so that we don't have to rebundle things like
// react everytime there's a change in the js file
if (!isProduction && scriptsCount === 1){
// create vendors.js for dev environment.
browserify({
require: dependencies,
debug: true
})
.bundle()
.on('error', gutil.log)
.pipe(source('vendors.js'))
.pipe(gulp.dest('./public/js/'));
}
if (!isProduction){
// make the dependencies external so they dont get bundled by the
// app bundler. Dependencies are already bundled in vendor.js for
// development environments.
dependencies.forEach(function(dep){
appBundler.external(dep);
})
}
appBundler
// transform ES6 and JSX to ES5 with babelify
.transform("babelify", {presets: ["es2015", "react"]})
.bundle()
.on('error',gutil.log)
.pipe(source('bundle.js'))
.pipe(gulp.dest('./public/js/'));
}