-
Notifications
You must be signed in to change notification settings - Fork 0
/
gulpfile.js
145 lines (132 loc) · 4.03 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
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
(function() {
'use strict';
var gulp = require('gulp'); // Base gulp package
var bower = require('gulp-bower'); // Bower front-end package management
var browserSync = require('browser-sync').create(); // BrowserSync for browser refresh when required
var reload = browserSync.reload; // Reload func of BrowserSync
var imagemin = require('gulp-imagemin'); // Image minification and optimization
var changed = require('gulp-changed'); // Filters src to only pass changed files
var sass = require('gulp-sass'); // Sass compatibility package
var minifyCSS = require('gulp-minify-css'); // CSS minification
var htmlmin = require('gulp-htmlmin'); // gulp plugin to minify HTML
var autoprefixer = require('gulp-autoprefixer'); // CSS autoprefixer
var rename = require('gulp-rename'); // Package for renaming files
var concat = require('gulp-concat'); // File concatenation
var babel = require('gulp-babel'); // Babel package
var uglify = require('gulp-uglify'); // JS uglify package
var jshint = require('gulp-jshint'); // JSHint package for error logging
var plumber = require('gulp-plumber'); // Plumber keeps gulp running after CSS/JS errors
var gutil = require('gulp-util'); // Utility functions for gulp plugins
var spawn = require('child_process').spawn; // Gulp process management
// Browser sync task
gulp.task('browser-sync', function() {
browserSync.init({
server: {
baseDir: './',
},
logLevel: 'debug',
});
});
// All tasks related to styles
gulp.task('sass', function() {
return gulp
.src('scss/main.scss')
.pipe(changed('build'))
.pipe(plumber())
.pipe(sass({
style: 'compressed'
}))
.on('error', function(err) {
gutil.log(err);
this.emit('end');
})
.pipe(autoprefixer())
.pipe(minifyCSS())
.pipe(concat('app.min.css'))
.pipe(gulp.dest('build'))
.pipe(reload({
stream: true
}));
});
// All tasks related to JS
// Set uglify to mangle: false to avoid problems with angular code
gulp.task('script', function() {
return gulp
.src([
'bower_components/angular/angular.min.js',
'bower_components/angular-resource/angular-resource.min.js',
'js/app.js',
'js/filters/*.js',
'js/services/*.js',
'js/factories/*.js',
'js/components/*.js',
'js/controllers/*.js'
])
.pipe(changed('build'))
.pipe(plumber())
.pipe(jshint())
.pipe(concat('app.min.js'))
// .pipe(babel({
// presets: ['es2015']
// }))
// .pipe(uglify({
// mangle: false
// }))
.on('error', function(err) {
gutil.log(err);
this.emit('end');
})
.pipe(gulp.dest('build'))
.pipe(reload({
stream: true
}));
});
// All tasks related to HTML
gulp.task('html', function() {
return gulp
.src('*.html')
.pipe(htmlmin({
collapseWhitespace: true
}))
.pipe(gulp.dest('build'))
.pipe(reload({
stream: true
}));
});
// Image compression task
gulp.task('image', function() {
return gulp
.src('assets/img/*')
.pipe(imagemin({
optimizationLevel: 5
}))
.pipe(gulp.dest('assets/img'));
});
// Setup reload gulp task on gulpfile.js change
gulp.task('auto-reload', function() {
var process;
function restart() {
if (process) {
process.kill();
}
process = spawn('gulp', ['default'], {
stdio: 'inherit'
});
}
gulp.watch('gulpfile.js', restart);
restart();
});
// Bower task for getting front-end package dependencies
gulp.task('bower', function() {
return bower()
.pipe(gulp.dest('bower_lib/'));
});
// Watch tasks
gulp.task('watch', function() {
gulp.watch('scss/**/*', ['sass']);
gulp.watch('js/**/*', ['script']);
gulp.watch(['**/*.html'], ['html']);
});
// Default gulp run tasks
gulp.task('default', ['sass', 'script', 'html', 'image', 'browser-sync', 'watch']);
})();