-
Notifications
You must be signed in to change notification settings - Fork 0
/
gulpfile.js
109 lines (92 loc) · 2.79 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
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
var source = require('vinyl-source-stream');
var gulp = require('gulp');
var gutil = require('gulp-util');
var browserify = require('browserify');
var babelify = require('babelify');
var watchify = require('watchify');
var notify = require('gulp-notify');
var stylus = require('gulp-stylus');
var autoprefixer = require('gulp-autoprefixer');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var buffer = require('vinyl-buffer');
var browserSync = require('browser-sync');
var reload = browserSync.reload;
var historyApiFallback = require('connect-history-api-fallback')
/*
Styles Task
*/
gulp.task('styles',function() {
// move over fonts
gulp.src('css/fonts/**.*')
.pipe(gulp.dest('build/css/fonts'))
// Compiles CSS
gulp.src('css/style.styl')
.pipe(stylus())
.pipe(autoprefixer())
.pipe(gulp.dest('./build/css/'))
.pipe(reload({stream:true}))
});
/*
Images
*/
gulp.task('images',function(){
gulp.src('css/images/**')
.pipe(gulp.dest('./build/css/images'))
});
/*
Browser Sync
*/
gulp.task('browser-sync', function() {
browserSync({
// we need to disable clicks and forms for when we test multiple rooms
server : {},
middleware : [ historyApiFallback() ],
ghostMode: false
});
});
function handleErrors() {
var args = Array.prototype.slice.call(arguments);
notify.onError({
title: 'Compile Error',
message: '<%= error.message %>'
}).apply(this, args);
this.emit('end'); // Keep gulp from hanging on this task
}
function buildScript(file, watch) {
var props = {
entries: ['./scripts/' + file],
debug : true,
transform: [babelify.configure({stage : 0 })]
};
// watchify() if watch requested, otherwise run browserify() once
var bundler = watch ? watchify(browserify(props)) : browserify(props);
function rebundle() {
var stream = bundler.bundle();
return stream
.on('error', handleErrors)
.pipe(source(file))
.pipe(gulp.dest('./build/'))
// If you also want to uglify it
// .pipe(buffer())
// .pipe(uglify())
// .pipe(rename('app.min.js'))
// .pipe(gulp.dest('./build'))
.pipe(reload({stream:true}))
}
// listen for an update and run rebundle
bundler.on('update', function() {
rebundle();
gutil.log('Rebundle...');
});
// run it once the first time buildScript is called
return rebundle();
}
gulp.task('scripts', function() {
return buildScript('main.js', false); // this will run once because we set watch to false
});
// run 'scripts' task first, then watch for future changes
gulp.task('default', ['images','styles','scripts','browser-sync'], function() {
gulp.watch('css/**/*', ['styles']); // gulp watch for stylus changes
return buildScript('main.js', true); // browserify watch for JS changes
});