Gulp не следит за изменениями в файлах .html и .css?

Добрый день. Подскажите пожалуйста где я мог ошибиться?
Хочу следить за изменениями .css и .html и при сохранении делать hot reload

var gulp = require('gulp');
var browserSync = require('browser-sync').create();
var reload      = browserSync.reload;
var paths = {
    css: ['./style/*.css'],
    html: ['./*.html']
};

gulp.task('serve', function () {

    // Serve files from the root of this project
    browserSync.init({
        server: {
            baseDir: "./"
        }
    });

    gulp.watch(paths.css, paths.html).on("change", reload);
});


При таком варианте собственно все работает, но он следит только за .html файлом.
'use strict';

const gulp = require('gulp');
var browserSync = require('browser-sync').create();
var reload      = browserSync.reload;



gulp.task('serve', function () {

    // Serve files from the root of this project
    browserSync.init({
        server: {
            baseDir: "./"
        }
    });

    gulp.watch("*.html").on("change", reload);
});


В первом (нужном) варианте при запуске gulp serve никаких ошибок, но и в консоле собственно тоже ничего.

Структура простая

└── node_modules
└── style/.css
└── index.html
  • Вопрос задан
  • 327 просмотров
Пригласить эксперта
Ответы на вопрос 2
alvvi
@alvvi
export default apathy;
gulp.watch(paths.css, paths.html)
Вы передали два разных аргумента, а нужен один.
Попробуйте
gulp.watch(['./path/to/styles/*/**.*.css ', './path/to/html/*/**.*html'])
Ответ написан
@oxmad
Миллионер, филантроп
По хорошему у вас должно быть 2 папки src и dist (к примеру). В src у нас находятся исходники html, sass, js и прочее, а в dist уже готовый проект (build).
В вашем случае создайте в папке проекта папку src и перенесите туда html и css файлы (Также проверьте пути к файлам). Как понадобится, просто добавите перенос и компиляцию в папку dist.
P.S. Называйте html файл index.html, если он отличается, то добавляйте параметр "index: Название_вашего_файла.html"
'use strict';

const gulp            = require('gulp'),
var browserSync  = require('browser-sync'),
var reload            = browserSync.reload;

// BrowserSync
gulp.task('serve', function () {
    browserSync({
        server: {
            baseDir: "src"
            //index: "paths.html" если название нестандартное
        },
        notify: false
    });
});

// Watch
gulp.task('watch', function() {
  gulp.watch('./src/css/**/*.css', reload),
  gulp.watch('./src/*.html', reload);
});

Запускаем командой gulp watch.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
03 июл. 2020, в 19:33
3000 руб./за проект
03 июл. 2020, в 18:57
3000 руб./за проект