1

Раньше все работало хорошо, даже в этом проекте в начале не было никаких проблем, сейчас никаких ошибок не выбивает, но при вводе команды gulp или gulp build сборка останавливается, если несколько раз повторить попытку, то сборка завершается удачно, также если при работе команды gulp вносить изменения в css и js то все работает хорошо, но если внести какие-то изменения в html, то в браузере это не отражается и нужно заново все запускать.

Результат, когда сборка прошла успешно:
введите сюда описание изображения
введите сюда описание изображения

Результат, когда сборка прошла не успешно: введите сюда описание изображения
введите сюда описание изображения

Вот что показывает в терминале, когда внесены изменения в html не отразились в браузере:
введите сюда описание изображения

Код gulpfile:

"use strict";

var gulp = require("gulp"),
    autoprefixer = require("gulp-autoprefixer"),
    cssbeautify = require("gulp-cssbeautify"),
    removeComments = require('gulp-strip-css-comments'),
    rename = require("gulp-rename"),
    sass = require("gulp-sass"),
    rigger = require("gulp-rigger"),
    uglify = require("gulp-uglify"),
    watch = require("gulp-watch"),
    plumber = require("gulp-plumber"),
    run = require("run-sequence"),
    rimraf = require("rimraf"),
    webserver = require("browser-sync");



/* Paths to source/build/watch files
=========================*/

var path = {
    build: {
        html: "dist/",
        js: "dist/assets/js/",
        css: "dist/assets/css/",
        img: "dist/assets/img/",
        fonts: "dist/assets/fonts/",
        json: "dist/assets/"
    },
    src: {
        html: "src/*.{htm,html,php}",
        js: "src/assets/js/*.js",
        css: "src/assets/sass/*.scss",
        img: "src/assets/img/**/*.*",
        fonts: "src/assets/fonts/**/*.*",
        json: "src/assets/*.json"
    },
    watch: {
        html: "src/**/*.{htm,html,php}",
        js: "src/**/*.js",
        css: "src/**/*.scss",
        img: "src/assets/img/**/*.*",
        fonts: "src/assets/fonts/**/*.*",
        json: "src/assets/*.json"
    },
    clean: "./dist"
};



/* Webserver config
=========================*/

var config = {
    server: "dist/",
    notify: false,
    open: true,
    ui: false
};



/* Tasks
=========================*/

gulp.task("webserver", function () {
    webserver(config);
});


gulp.task("html:build", function () {
    return gulp.src(path.src.html)
    .pipe(plumber())
    .pipe(rigger())
    .pipe(gulp.dest(path.build.html))
    .pipe(webserver.reload({stream: true}));
});


gulp.task("css:build", function () {
    gulp.src(path.src.css)
    .pipe(plumber())
    .pipe(sass().on('error', sass.logError))
    .pipe(autoprefixer({
        browsers: ["last 8 versions"],
        cascade: true
    }))
    .pipe(cssbeautify())
    .pipe(gulp.dest(path.build.css))
    .pipe(webserver.reload({stream: true}));
});


gulp.task("js:build", function () {
    gulp.src(path.src.js)
    .pipe(plumber())
    .pipe(rigger())
    .pipe(gulp.dest(path.build.js))
    .pipe(uglify())
    .pipe(rename("main.min.js"))
    .pipe(gulp.dest(path.build.js))
    .pipe(webserver.reload({stream: true}));
});


gulp.task("fonts:build", function() {
    gulp.src(path.src.fonts)
    .pipe(gulp.dest(path.build.fonts));
});


gulp.task("image:build", function () {
    gulp.src(path.src.img)
    .pipe(gulp.dest(path.build.img));
});


gulp.task("json:build", function() {
    gulp.src(path.src.json)
    .pipe(gulp.dest(path.build.json));
});


gulp.task("clean", function (cb) {
    rimraf(path.clean, cb);
});


gulp.task('build', function (cb) {
    run(
        "clean",
        "html:build",
        "css:build",
        "js:build",
        "fonts:build",
        "image:build",
        "json:build"
        , cb);
});


gulp.task("watch", function() {
    watch([path.watch.html], function(event, cb) {
        gulp.start("html:build");
    });
    watch([path.watch.css], function(event, cb) {
        gulp.start("css:build");
    });
    watch([path.watch.js], function(event, cb) {
        gulp.start("js:build");
    });
    watch([path.watch.img], function(event, cb) {
        gulp.start("image:build");
    });
    watch([path.watch.fonts], function(event, cb) {
        gulp.start("fonts:build");
    });
    watch([path.watch.json], function(event, cb) {
        gulp.start("json:build");
    });
});


gulp.task("default", function (cb) {
   run(
       "clean",
       "build",
       "webserver",
       "watch"
   , cb);
});

6
  • @MaximLensky У меня сейчас такой код webserver = require("browser-sync");, мне нужно просто его изменить, или и скачать новый Browsersync? 11 апр 2020 в 8:34
  • @MaximLensky Я в этом плохо разбираюсь, этот код писал не с нуля, а только отредактировал немного под себя, можете сбросить часть кода, как правильно должно быть? 11 апр 2020 в 8:48
  • @MaximLensky Я изменил свой код на такой webserver = require("browser-sync").create();, но это не решило мою проблему, сборка все равно не всегда запускается с первого раза. 11 апр 2020 в 9:00
  • И здесь явно проблема не в browsersync, так как даже при команде gulp build не всегда происходит сборка, а там локальный сервер не задействуется. 11 апр 2020 в 9:04

0

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Посмотрите другие вопросы с метками или задайте свой вопрос.