var gulp = require('gulp');
var sass = require('gulp-sass')(require('sass'));
var watch = require('gulp-watch');
var browserSync = require('browser-sync').create();
var useref = require('gulp-useref');
var uglify = require('gulp-uglify');
var gulpIf = require('gulp-if');
var cssnano = require('gulp-cssnano');
var imagemin = require('gulp-imagemin');
var cache = require('gulp-cache');
var del = require('del');
gulp.task('sass', function(){
return gulp.src('app/scss/**/*.scss')
.pipe(sass({outputStyle: 'expanded'}))
.pipe(gulp.dest('app/css'))
.pipe(browserSync.reload({stream: true}))
});
gulp.task('html', function(){
return gulp.src('app/*.html')
.pipe(browserSync.reload({stream: true}))
});
gulp.task('js', function(){
return gulp.src('app/js/**/*.js')
.pipe(browserSync.reload({stream: true}))
});
gulp.task('browser-sync', function(){
browserSync.init({
server: {
baseDir: 'app'
}
});
});
gulp.task('watch', function(){
gulp.watch('app/scss/**/*.scss', gulp.parallel('sass'));
gulp.watch('app/*.html', gulp.parallel('html'));
gulp.watch('app/js/**/*.js', gulp.parallel('js'));
});
gulp.task('useref', function(){
return gulp.src('app/*.html')
.pipe(useref())
.pipe(gulpIf('*.js', uglify()))
.pipe(gulpIf('*.css', cssnano()))
.pipe(gulp.dest('dist'))
});
gulp.task('images', function(){
return gulp.src('app/images/**/*.+(png|jpg|jpeg|gif|svg)')
.pipe(cache(imagemin({interlaced: true})))
.pipe(gulp.dest('dist/images'))
});
gulp.task('fonts', function() {
return gulp.src('app/fonts/**/*')
.pipe(gulp.dest('dist/fonts'))
})
gulp.task('clean', function() {
return del.sync('dist').then(function(cb) {
return cache.clearAll(cb);
});
})
gulp.task('clean:dist', function() {
return del(['./dist/**', '!./dist/images/**']);
});
gulp.task('default', gulp.parallel(['sass', 'browser-sync', 'watch']));
gulp.task('build', gulp.series('clean:dist', parallel('sass', 'useref', 'images', 'fonts')));