Skip to content

Instantly share code, notes, and snippets.

Created October 9, 2020 06:03
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save devzom/3c44084898f5c77c4df1384fda42b0be to your computer and use it in GitHub Desktop.
GULP: Basic configuration for GULP 4
const {src, dest, watch, series, parallel} = require('gulp'); //ES destructuring assignment
var sass = require("gulp-sass"),
autoPrefixer = require("gulp-autoprefixer"),
minifyCss = require("gulp-clean-css"),
rename = require("gulp-rename"),
concat = require("gulp-concat"),
uglify = require("gulp-uglify"),
plumber = require("gulp-plumber"),
util = require("gulp-util"),
browserSync = require("browser-sync").create(),
reload = browserSync.reload;
var srcs = {
html: ["./**/*.html"],
css: ["./assets/css/**/*.css"],
sass: ["./assets/sass/**/*.scss"],
js: ["./assets/js/*.js"],
function sass() {
return src("./assets/sass/sys.scss")
browsers: ["> 5%", "last 2 versions", "not ie <=8"],
cascade: true,
remove: true
basename: "sys"
stream: true
suffix: ".m"
stream: true
util.log(util.colors.yellow("website styles compied and minified"));
function js(){
return src("./assets/js/sys.js")
stream: true
})); //not sure if you intentionally did not put dest() stream method
function browser_sync(cb) {
server: {
baseDir: "./"
browser: ["google chrome"]
const watcher = watch(srcs.html);
watcher.on('change', reload);
watcher.on("change", reload);
watch(srcs.sass, series(sass));
watch(srcs.js, series(js));
//this will first trigger sass() and js() functions parallel, then after executing these two, browser_sync will run
exports.default = series(parallel(sass, js), browser_sync);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment