gulpfile.js
// Gulp 4
const { src, dest, watch, series, parallel } = require('gulp');
// Importing all the Gulp-related packages we want to use
const sourcemaps = require('gulp-sourcemaps');
const sass = require('gulp-sass');
var sassGlob = require('gulp-sass-glob');
const concat = require('gulp-concat');
const uglify = require('gulp-uglify');
const postcss = require('gulp-postcss');
const autoprefixer = require('autoprefixer');
const cssnano = require('cssnano');
var replace = require('gulp-replace');
const argv = require('yargs').argv;
var gs = require('glob-stream');
const babel = require('gulp-babel');
var rename = require('gulp-rename');
var is_production = (argv.production === undefined) ? false : true;
var project = { // build settings
vendor: {
files_to_watch: ['./vendor/**/*'],
styles: ['./vendor/**/*.css'],
scripts: ['./vendor/**/*.js'],
},
styles: {
files_to_watch: [
'./sass/**/*.scss',
'./js/components/**/*.scss',
],
entry: './sass/style.scss',
dest: './../assets/',
},
scripts: {
files_to_watch: [
'./js/**/*.js',
'./js/components/**/*.html'
],
files: [
'./js/_templates.js',
'./js/services/*.js',
'./js/components/**/*.js',
'./js/directives/*.js',
'./js/_settings.js',
'./js/_global.js',
'./js/**/*.js',
],
templates: [
'./js/components/**/*.html'
],
dest: './../assets/',
}
};
function scssTask(){
return src(project.styles.entry)
.pipe(rename('./sass/_sleepless.min.scss'))
.pipe(sassGlob())
.pipe(sourcemaps.init())
.pipe(sass())
.pipe(postcss([ autoprefixer(), cssnano() ]))
.pipe(sourcemaps.write('.'))
.pipe(dest(project.styles.dest)
);
}
function jsTask(){
return src(project.scripts.files, { allowEmpty: true})
.pipe(concat('_sleepless.bundle.js'))
.pipe(babel({
presets: ['@babel/preset-env']
}))
.pipe(uglify())
.pipe(dest(project.scripts.dest)
);
}
function watchSass(){
watch(
['./sass/**/*.scss'],
series(scssTask)
);
}
function watchJs(){
watch(
['./js/**/*.js'],
series(jsTask)
);
}
exports.default = series(
parallel(scssTask, jsTask),
parallel(watchSass, watchJs));