Не могу настроить подключение slick-slider в gulp, выдает очень странную ошибку в консоли
const {src, dest, watch, parallel, series} = require('gulp'); // с помощью ES6 вызываем из Gulp его методы: dest - перемещение файлов, watch - слежение за файлами
const scss = require('gulp-sass'); // преобразователь scss в css
const concat = require('gulp-concat'); // для объединения файлов
const uglify = require('gulp-uglify-es').default // для минификации js-файлов
const imagemin = require('gulp-imagemin')
const del = require('del') // для удаления папок перед обновлением
const autoprefixer = require('gulp-autoprefixer'); // для поддержки старых браузеров
const browserSync = require('browser-sync').create(); // автообновление
function styles() { // функция должна возвращать файл gulp(src)
return src([
'node_modules/slick-carousel/slick/slick.scss',
'app/scss/*.scss']
) // все файлы в папке scss с расширением .scss
.pipe(scss({
outputStyle: 'compressed' // минификация файла
})) // проходит через этот pipe и становится css
.pipe(concat('style.min.css')) // проходя через этот pipe, файл переименовывается в style.min.css
.pipe(autoprefixer({
overrideBrowserslist: ['last 10 version'],
grid: true
}))
.pipe(dest('app/css')) // dest перемещает файл в указанное место
.pipe(browserSync.stream()); // автообновление!!!
}
function scripts() {
return src([
'node_modules/slick-carousel/slick/slick.js',
'node_modules/jquery/dist/jquery.js',
'app/js/main.js'
])
.pipe(concat('main.min.js')) // объединение всех файлов js в один файл
.pipe(uglify()) // минифицируем js-файлы
.pipe(dest('app/js/'))
.pipe(browserSync.stream());
}
function images() {
return src('app/img/*.*') // путь до картинок *.* - все названия со всеми разрешениями
.pipe(imagemin([
imagemin.gifsicle({interlaced: true}),
imagemin.mozjpeg({quality: 75, progressive: true}),
imagemin.optipng({optimizationLevel: 5}),
imagemin.svgo({
plugins: [
{removeViewBox: true},
{cleanupIDs: false}
]
})
]))
.pipe(dest('dist/img'))
}
function cleaner() { // удаляет папку перед обновлением
return del('dist')
}
function build() { // все конвертируем в окончательный проект
return src([
'app/css/style.min.css',
'app/fonts/**/*',
'app/js/main.min.js',
'app/*.html'
], {base: 'app'})
.pipe(dest('dist'))
}
function browsersync() {
browserSync.init({ // штука с офиц. сайта
server: {
baseDir: "app/" // корень проекта
}
});
}
function watching() {
watch(['app/scss/**/*.scss'], styles); // синтаксис --------- watch(['путь до файла'], действие с файлом) ** - во всех папках и подпапках идёт поиск. *.scss - все файлы с расширением .scss
watch(['app/js/**/*.js', '!app/js/main.min.js'], scripts); // слежение за всеми файлами js кроме main.min.js (!)
watch(['app/*.html']).on('change', browserSync.reload) // вызывает функции перезагрузки страницы при изменении в файлах html
}
exports.styles = styles; // экспорт функции base
exports.scripts = scripts;
exports.images = images;
exports.watching = watching;
exports.browsersync = browsersync;
exports.cleaner = cleaner;
exports.build = series(cleaner, images, build); // сначала выполняется функция cleaner, потом build. series - последовательное выполнение функций
exports.default = parallel(browsersync, watching)
<img src="https://habrastorage.org/webt/60/9d/83/609d83047c991340404019.png" alt="image"/><img src="https://habrastorage.org/webt/60/9d/83/609d830bb2aab741215704.png" alt="image"/>
Средний
Простой
