Sample gulp v4 gulpfile.js

gulpfile.js

const { src, dest, watch, parallel } = require('gulp');
const gulp = require('gulp');

const autoprefixer = require("autoprefixer");
const babel = require('gulp-babel');
const concat = require('gulp-concat');
const cssnano = require("cssnano");
const less = require('gulp-less');
const livereload = require('gulp-livereload');
const path = require('path');
const postcss = require("gulp-postcss");
const rename = require('gulp-rename');
const sriHash = require('gulp-sri-hash');
const uglify = require('gulp-uglify');

function sri() {
  return src('./*-dev.html')
    .pipe(sriHash())
    .pipe(rename(function(opt) {
        opt.basename = opt.basename.replace(/-dev/, '');
        return opt;
    }))
    .pipe(dest('./'))
}

function html() {
  return src('./**/*-dev.html')
    .pipe(livereload());
}

function css () {
  return src('assets/less/norr3.less')
    .pipe(less())
    .pipe(dest('public/css'))
    .pipe(rename({suffix: ".min"}))
    .pipe(postcss([autoprefixer(), cssnano()]))
    .pipe(dest("./public/css"))
    .pipe(livereload());
}

function js() {
  return src('assets/js/**/*.js')
    .pipe(babel({ presets: ['@babel/preset-env'] }))
    .pipe(concat('norr3.js'))
    .pipe(dest('./public/js'))
    .pipe(rename('norr3.min.js'))
    .pipe(uglify())
    .pipe(dest('./public/js'))
    .pipe(livereload());
}

function fonts() {
  return src(['./assets/font/**/*'])
    .pipe(dest('./public/font'));
}

function images() {
  return src(['./assets/img/**/*'])
    .pipe(dest('./public/img'));
}

exports.default = function () {
  livereload.listen();
  watch(['./assets/less/**/*.less'], css);
  watch(['./assets/js/**/*.js'], js);
  watch(['./*-dev.html'], html);
}
exports.prod = parallel(css, js, fonts, images, sri);