Прежде всего, я полный новичок в gulp.
Я создал файл gulp и все отлично работает, пока я не использую gulp watch и не изменю свой файл S CSS несколько раз подряд.
Как видите, время выполнения увеличивается с каждым изменением
Ссылка на скриншот
Я пытался найти решение за прошедший час и теперь решил спросить здесь.
Кто-нибудь из вас когда-либо сталкивался с такой проблемой раньше? Если да, то как мне это исправить?
Я на самом деле ничего не понимаю ...
Вот мой глоток. js
"use strict";
// Load plugins
const browsersync = require("browser-sync").create();
const gulp = require("gulp");
const header = require("gulp-header");
const plumber = require("gulp-plumber");
const rename = require("gulp-rename");
const sass = require("gulp-sass");
const uglify = require("gulp-uglify");
// Load package.json for banner
const pkg = require('./package.json');
// BrowserSync
function browserSync(done) {
browsersync.init({
server: {
baseDir: "./"
},
port: 3000
});
// done();
}
// BrowserSync reload
function browserSyncReload(done) {
browsersync.reload();
done();
}
// CSS task
function css() {
return gulp
.src("./scss/**/*.scss")
.pipe(plumber())
.pipe(sass({
outputStyle: "expanded",
includePaths: "./node_modules",
}))
.pipe(gulp.dest("./css"))
.pipe(browsersync.stream());
}
// JS task
function js() {
return gulp
.src([
'./js/*.js',
'!./js/*.min.js'
])
.pipe(uglify())
.pipe(header(banner, {
pkg: pkg
}))
.pipe(rename({
suffix: '.min'
}))
.pipe(gulp.dest('./js'))
.pipe(browsersync.stream());
}
// Watch files
function watchFiles() {
gulp.watch("./scss/**/*", css);
gulp.watch(["./js/**/*", "!./js/**/*.min.js"], js);
gulp.watch("./**/*.html", browserSyncReload);
}
// Define complex tasks
const build = gulp.series(gulp.parallel(css, js));
const watch = gulp.series(build, gulp.parallel(watchFiles, browserSync));
// Export tasks
exports.css = css;
exports.js = js;
exports.build = build;
exports.watch = watch;
exports.default = build;
Если мне потребуется предоставить вам любую дополнительную информацию, я сообщу.
Заранее спасибо, ребята.