Using these files, you can quickly configure the build of your project on Gulp.

• gulp-sass - compilation of SASS, SCSS into CSS;
• Browsersync - browser auto-refresh;
• gulp-autoprefixer - automatically arranges vendor prefixes in CSS in accordance with the Can I Use service;
• clean-css - CSS optimizer;
• gulp-concat - file concatenation;
• gulp-sourcemaps - creating sourcemaps;
• gulp-uglify - Minify JavaScript;
• del - Delete files and directories using globs;

Install Node JS

Install Git

Open cmd on Windows or Terminal on Linux/MacOS and follow next steps:

• install gulp globally - npm install --global gulp-cli
• download build - git clone https://github.com/alexhamenko/gulp-4-sass
• go to the project folder - cd gulp-4-sass
• install packages from package.json - npm i
• run gulp command to make sure everything is installed correctly

./src

/css

/main.scss  
/media.scss  

/js

/lib.js  
/main.js  

./gulpfile.js
./package.json
./index.html

1. Go to the project folder - cd gulp-4-sass
2. Run command npm i
3. Run command npm i -SD gulp-less
4. Run command npm uninstall gulp-sass -SD
5. Change extensions of style files from scss to less in the src/css folder
6. Replace SCSS code with LESS code in the style files from src/css folder
7. Edit gulpfile.js:
   • change const sass = require('gulp-sass'); to const less = require('gulp-less');
   • change files extensions from scss to less in the const cssFiles
   • change .pipe(sass()) to the .pipe(less()) in the styles() function
   • change gulp.watch('./src/css/**/*.sass', styles); to the gulp.watch('./src/css/**/*.less', styles); in the watch() function
   • delete gulp.watch('./src/css/**/*.scss', styles);

1. Go to the project folder - cd gulp-4-sass
2. Run command npm i
3. Run command npm i -SD gulp-stylus
4. Run command npm uninstall -SD gulp-sass
5. Change extensions of style files from scss to styl in the src/css folder
6. Replace SCSS code with Stylus code in the style files from src/css folder
7. Edit gulpfile.js:
   • change const sass = require('gulp-sass'); to const stylus = require('gulp-stylus');
   • change file's extensions from scss to styl in the const cssFiles
   • change .pipe(sass()) to .pipe(stylus()) in the styles() function
   • change gulp.watch('./src/css/**/*.sass', styles); to the gulp.watch('./src/css/**/*.styl', styles); in the watch() function
   • delete gulp.watch('./src/css/**/*.scss', styles);

Based on this build