Часы Gulp 4 работают один раз

Я пытался получить это некоторое время, но я никак не могу запустить его после первого сохранения файла.

Всякий раз, когда я начинаю глотать и вносить какие-либо изменения в html файл, он корректно перезагружает страницу, но после первого сохранения он просто не будет этого делать, даже если html файл был сохранен в public папка.

Я обновил до Gulp v4, и я пытался добавить gulp.series а также gulp.parallelЯ не знаю, что я делаю не так. Если кто-то может увидеть какую-либо ошибку в коде... (пока только на сайте generateHtml, если мы сможем заставить его работать, я думаю, я смогу заставить их также работать).

var gulp = require("gulp"),
    browser = require("browser-sync").create(),
    less = require("gulp-less"),
    autoprefixer = require('gulp-autoprefixer'),
    sourcemaps = require("gulp-sourcemaps"),
    concat = require('gulp-concat'),
    clean = require('gulp-rimraf'),
    gulpCopy = require('gulp-copy');

//Sincronización de pantallas
gulp.task('browser-sync', () => {
    browser.init({
        server: {
            baseDir: './public'
        },
        notify: {
            styles: {
                top: 'auto',
                bottom: '0'
            }
        },
        injectChanges: true
    });
});

//Refrescar pantalla
gulp.task('re-loaded', function() {
    console.log("a")
    browser.reload()
});


gulp.task('watch', () => {
    gulp.watch('src/js/*.js', gulp.series('cleanJs', 'generateJs', 're-loaded'));
    gulp.watch('src/css/*.less', gulp.series('cleanCss', 'less', 're-loaded'));
    gulp.watch('src/**/*.html', gulp.series('cleanHtml', gulp.parallel('generateHtml', 're-loaded')));
    gulp.watch('src/img/**/**.*', gulp.series('cleanImg', 'copy', 're-loaded'));
    gulp.watch('src/libs/**/**.*', gulp.series('cleanLibs', 'copy', 're-loaded'));
    gulp.watch('src/fonts/**.*', gulp.series('cleanFonts', 'copy', 're-loaded'));
});

//Generar nuevo HTML en public
gulp.task('generateHtml', () => {
    gulp.src('src/*.html')
        .pipe(gulp.dest('./public/'))
});

//Actualización de las funciones JS cuando guardemos
gulp.task('generateJs', () => {
    gulp.src('src/js/*.js')
        .pipe(concat("script.js"))
        .pipe(gulp.dest('./public/js'))
});

//Actualización de los estilos CSS cuando guardemos
gulp.task('less', () => {
    gulp.src(['src/*.less'])
    .pipe(less({
        // pretty: true
    }))
    .pipe(autoprefixer('last 2 versions'))
    .pipe(concat("style.css"))
    .pipe(gulp.dest('./public/css'))
});

//Copiar a public
gulp.task('copy', () => {
    return gulp
        .src(['src/fonts/**/**.*', 'src/img/**/**.*', 'src/libs/**/**.*'])
        .pipe(gulpCopy('./public/', {prefix: 1} ));
});

//Borrar imágenes de public
gulp.task('cleanImg', () => {
    return gulp.src("./public/img/**/**.*", { read: false }).pipe(clean());
});

//Borrar librerías de public
gulp.task('cleanLibs', () => {
    return gulp.src("./public/libs/**/**.*", { read: false }).pipe(clean());
});

//Borrar fuentes de public
gulp.task('cleanFonts', () => {
    return gulp.src("./public/fonts/**/**.*", { read: false }).pipe(clean());
});

//Borrar JS de public
gulp.task('cleanJs', () => {
    return gulp.src("./public/js/*", { read: false }).pipe(clean());
});

//Borrar CSS de public
gulp.task('cleanCss', () => {
    return gulp.src("./public/css/*.css", { read: false }).pipe(clean());
});

//Borar HTML de public
gulp.task('cleanHtml', () => {
    return gulp
        .src("./public/*.html", { read: false })
        .pipe(clean());
});

gulp.task('default', gulp.parallel('generateHtml', 'generateJs', 'less', 'browser-sync', 'watch', 'copy'));

1 ответ

Решение

Эта задача, вероятно, никогда не заканчивается:

//Refrescar pantalla
gulp.task('re-loaded', function() {
    console.log("a")
    browser.reload()
});

изменить на:

//Refrescar pantalla
gulp.task('re-loaded', function(done) {
    console.log("a")
    browser.reload()
    done()
});

или же

//Refrescar pantalla
gulp.task('re-loaded', () => {
    console.log("a")
    browser.reload()
});

[На самом деле, после второй мысли, этот второй вариант, вероятно, не будет работать, потому что он не будет возвращать поток. Я сомневаюсь, что browserSync.reload() возвращает поток или обещание, поэтому возвращение его результата не поможет. Надеемся, что метод обратного вызова - первый вариант выше - работает.]

Другие вопросы по тегам