Gulp error?

Hello help please I can not understand why the error occurs nodejs installed via brew and then installed
gulp npm install gulp -g

created the project
mkdir Gus
cd Gus

npm init

installed phyton and ruby via brew

saved a project npm install gulp --save-dev

have ustanovil library npm install gulp-ruby-sass gulp-autoprefixer gulp-minify-css gulp-rename --save-dev

created gulpfile.js,
wrote this

var gulp = require('gulp'),
sass = require('gulp-ruby-sass'),
autoprefixer = require('gulp-autoprefixer'),
minifycss = require('gulp-minify-css'),
rename = require('gulp-rename');
gulp.task('styles', function() {
return gulp.src('sass/*.scss')
.pipe(sass({ style: 'expanded' }))
.pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1'))
.pipe(gulp.dest('css'))
.pipe(rename({suffix: '.min'}))
.pipe(minifycss())
.pipe(gulp.dest('css'));
});

created a folder and a sass file style.scss
wrote the following
$color: #eee;
#box {
color : $color;
box-sizing: border-box;
}

run the following command:
gulp styles

error

Gus user$ gulp styles
[02:57:00] Using gulpfile ~/Desktop/Site/Gus/gulpfile.js
[02:57:00] Starting 'styles'...
[02:57:00] 'styles' errored after 9.28 ms
[02:57:00] TypeError: glob pattern string required
at new Minimatch (/Users/user/Desktop/Site/Gus/node_modules/minimatch/minimatch.js:116:11)
at setopts (/Users/user/Desktop/Site/Gus/node_modules/glob/common.js:118:20)
at new GlobSync (/Users/user/Desktop/Site/Gus/node_modules/glob/sync.js:40:3)
at Function.globSync [as sync] (/Users/user/Desktop/Site/Gus/node_modules/glob/sync.js:26:10)
at gulpRubySass (/Users/user/Desktop/Site/Gus/node_modules/gulp-ruby-sass/index.js:71:21)
at /Users/user/Desktop/Site/Gus/gulpfile.js:9:11
at taskWrapper (/Users/user/Desktop/Site/Gus/node_modules/undertaker/lib/set-task.js:13:15)
at bound (domain.js:415:14)
at runBound (domain.js:428:12)
at asyncRunner (/Users/user/Desktop/Site/Gus/node_modules/async-done/index.js:55:18)
March 20th 20 at 11:26
2 answers
March 20th 20 at 11:28
Solution
So bro look here rock!
const gulp = require('gulp'), // Connected Gulp
 cleanCSS = require('gulp-clean-css'),
 sass = require('gulp-sass'), // Plug-Sass package
 autoprefixer = require('gulp-autoprefixer'),
 concat = require('gulp-concat'); // Plug-in library for merging files

let pathBuild = './dist/', pathSrc = './src/';

gulp.task('sass', function () {
 return gulp.src(pathSrc + 'sass/**/*.+(sass|scss)')
 .pipe(sass({outputStyle: 'expanded'}).on('error', sass.logError))
 .pipe(autoprefixer({browsers: ['ie >= 9', 'last 2 version'], cascade: false}))
 .pipe(cleanCSS({compatibility: 'ie9'}))
 .pipe(gulp.dest(pathBuild + 'css'));
});
Thanks bro - treva.Stokes commented on March 20th 20 at 11:31
@joannie.Schimmel, Yes, no question, enjoy!)) But this is an example from the old version of Gulp, I recommend rock for 4 version!

But with version 4 quickly made note of:
const gulp = require('gulp'), // Connected Gulp
 cleanCSS = require('gulp-clean-css'),
 sass = require('gulp-sass'), // Plug-Sass package
 pug = require('gulp-pug'), // Plug-in, pug
 imagemin = require('gulp-imagemin'), // Plug-in library for working with images
 pngquant = require('imagemin-pngquant'), // library to work with png
 cache = require('gulp-cache'), // library caching
 spritesmith = require('gulp.spritesmith'), // Plug-in library to create sprites
 merge = require('merge2'), // merge Plug-in
 autoprefixer = require('gulp-autoprefixer'),
 concat = require('gulp-concat'), // Plug-in library for merging files
 uglifyES = require('uglify-es'),
 composer = require('gulp-uglify/composer'),
 uglify = composer(uglifyES, console), // Plug-in js-minification
 order = require("gulp-order"),
 del = require('del');

let browserSync = require('browser-sync').create();
let pathBuild = './dist/',
 pathSrc = './src/',

 pathFonts = [
 pathSrc + 'fonts/**/*'
],

 libsJS = [
'./node_modules/slick-carousel/slick/slick.min.js',
'./node_modules/bootstrap/dist/bootstrap.js',
'./node_modules/bootstrap/js/dist/popover.js',
'./node_modules/bootstrap/js/dist/tooltip.js',
'./node_modules/bootstrap/js/dist/util.js',
'./node_modules/bootstrap/js/dist/modal.js',
'./node_modules/bootstrap/js/dist/dropdown.js',
'./node_modules/bootstrap-select/dist/js/bootstrap-select.js',
'./node_modules/js-image-zoom/js-image-zoom.js',
'./node_modules/jquery-typeahead/dist/jquery.typeahead.min.js',

'./node_modules/overlayscrollbars/js/OverlayScrollbars.js',
'./node_modules/overlayscrollbars/js/jquery.overlayScrollbars.min.js',
'./node_modules/simplebar/dist/simplebar.min.js',
'./node_modules/popper.js/dist/popper.js'
];

clean = () => {
 return del(['dist']);
};

scssBuild = () => {
 return gulp.src(pathSrc + 'sass/**/*.+(sass|scss)')
 .pipe(sass({outputStyle: 'expanded'}).on('error', sass.logError))
 .pipe(autoprefixer({cascade: false}))
 .pipe(gulp.dest(pathBuild + 'css'));
};

cleanCSSBuild = () => {
 return gulp.src(pathBuild + 'css/**.css')
 .pipe(cleanCSS({compatibility: 'ie9'}))
 .pipe(gulp.dest(pathBuild + 'css/'))
};

pugBuild = () => {
 return gulp.src('src/pug/*.+(jade|pug)')
 .pipe(pug({pretty: '\t'}))
.pipe(gulp.dest('dist/'))

};

libs = () => {
 return gulp.src(libsJS)
 .pipe(gulp.dest(pathSrc + 'js/libs/'));
};

jsConcat = () => {
 return gulp.src(pathSrc + 'js/**/*.js')
.pipe(order([
"libs/*.js",
"@begin.js",
"modules/*.js",
"main.js",
"@end.js",
"modulesOnlyJS/*.js",
]))
.pipe(concat('main.js'))
 .pipe(gulp.dest(pathBuild + 'js'));
};

jsCompress = () => {
 return gulp.src(pathBuild + 'js/main.js')
.pipe(uglify())
 .pipe(gulp.dest(pathBuild + 'js'))
};

imageBuild = () => {
 return gulp.src(pathSrc + 'img/**/*')
.pipe(cache(imagemin({
 interlaced: true,
 progressive: true,
 svgoPlugins: [{removeViewBox: false}],
 use: [pngquant()]
})))
.pipe(gulp.dest('dist/img'));
};

fontsDev = () => {
 return gulp.src(pathFonts)
 .pipe(gulp.dest(pathBuild + 'fonts'));
};

sprite = () => {
 let spriteData = gulp.src('src/sprite/*.png').pipe(spritesmith({
 imgName: '../img/sprite.png',
 cssName: 'sprite.scss'
}));
 let imgStream = spriteData.img
.pipe(gulp.dest('src/img/'));
 let cssStream = spriteData.css
.pipe(gulp.dest('src/sprite/'));
 return merge(imgStream, cssStream);
};

browserSyncStart = () => {
browserSync.init({
 server: pathBuild
});
};

browserSyncReload = (done) => {
browserSync.reload();
done();
};

browserSyncstream = (done) => {
browserSync.stream();
done();
};

watchScrFiles = (done) => {
 gulp.watch('src/sass/**/*.+(sass|scss)', gulp.series(scssBuild, cleanCSSBuild, browserSyncReload));
 gulp.watch('src/pug/**/*.+(jade|pug)', gulp.series(pugBuild, browserSyncReload));
 gulp.watch('src/js/**/*.js', gulp.series(jsConcat, jsCompress, browserSyncReload));
 gulp.watch('src/img/**/*', ' gulp.series(imageBuild, browserSyncReload));
 // gulp.watch('src/sprite/**/*.png', gulp.series(sprite));
done();
};
const compressCssJs = gulp.parallel(cleanCSSBuild, jsCompress);
const watch = gulp.parallel(browserSyncStart, watchScrFiles);
const develop = gulp.series(clean, gulp.parallel(scssBuild, pugBuild, imageBuild, fontsDev, jsConcat), watch);
const build = gulp.series(clean, scssBuild, cleanCSSBuild, gulp.parallel(pugBuild, imageBuild, fontsDev), jsConcat, jsCompress, watch);

exports.compres = compressCssJs;
exports.clear = gulp.series(clean);
exports.libs = gulp.series(libs);
exports.watch = watch;
exports.dev = develop;
exports.default = build;


Here's another look. Also can you your package and other tools packaging, so for example, if you have not heard parceljs.org - Albertha.Tremblay commented on March 20th 20 at 11:34
March 20th 20 at 11:30
Check autoprefixer, if I'm not mistaken the list of browsers is written in the array

Find more questions by tags CSSJavaScriptHTMLGulp.js