Что не так в gulpfile.js не работает livereload при изменении html?

Question

[ivankalachikov86]

Не могу понять, почему не срабатывает livereload при изменении html файлов, но срабатывает при изменении less. Что нужно исправить чтобы заработал. И вообще, возможно как-то оптимизировать мой gulpfile?

var gulp = require('gulp');
var concatCss = require('gulp-concat-css');
var cleanCSS = require('gulp-clean-css');
var rename = require('gulp-rename');
var autoprefixer = require('gulp-autoprefixer');
var less = require('gulp-less');
var notify = require( 'gulp-notify' );
var livereload = require('gulp-livereload');


gulp.task('less', function () {
  return gulp.src('less/style.less')
    .pipe( less().on( 'error', notify.onError(
      {
        message: "<%= error.message %>",
        title  : "Sass Error!"
      } ) ))
    .pipe(rename('style-less.css'))
    .pipe(gulp.dest('css/'))
});
 
gulp.task('default', ['less'], function () {
  return gulp.src('css/*.css')
  	.pipe(autoprefixer({
			browsers: ['> 1%','last 3 versions'],
			cascade: false
		}))
    .pipe(concatCss('bundle.css')).on( 'error', notify.onError(
      {
        message: "<%= error.message %>",
        title  : "concatCSS Error!"
      } ) )
    .pipe(cleanCSS())
    .pipe(rename('bundle.min.css'))
    .pipe(gulp.dest('out/'))
		.pipe(livereload())
    .pipe(notify("Done"));
});

gulp.task('watch',function() {
  livereload.listen();
  gulp.watch('less/**/*.less', ['default']);
  gulp.watch('*.html',  ['default']);
  
});

Answer 1

[Антон]

Попробуй положить .html файлы в подпапку и укажи путь к ним по аналогии с папкой для .less файлов.
Или же использовать gulp-connect или browser-sync.

Comments

[ivankalachikov86]

Спасибо, перешел на browser-sync