Как вы вызываете задачи в gulp с живой перезагрузкой - после изменения файла

Question

Я определил в файле gulp следующую задачу:

gulp.task('watch:livereload', function(){
  livereload.listen();
  gulp.watch('app/**').on('change', livereload.changed);
});

Лишь недавно я понял, что это отлично подходит только для статических вещей, таких как HTML.Потому что я использую Sass, а приложение в основном JS.Я хотел бы вызвать некоторые заранее определенные задачи для перекомпиляции js и css при любых изменениях в них.

Я вызываю задачи следующим образом:

gulp.task('compile:development',
  [
    'bower',
    'compile:scripts:development',
    'compile:sass:development',
    'serve',
    'watch:livereload'
  ]
);

Но я хочу, чтобы задачи выполнялись при изменении.Идеи?

Answer 1

Вам следует продолжать использовать livereload точно так же, как и вы, для обновления браузера.Если вы хотите повторно запустить некоторые задачи после изменения, я думаю, что gulp.watch это простой и встроенный способ.

gulp.watch('app/**', ['compile:development']);

Или более конкретные задачи:

gulp.watch('app/**', ['compile:scripts:development', 'compile:sass:development']);

Пример watch задача, которая определяет некоторые watchers с разными tasks :

gulp.task('watch', function () {
   gulp.watch('app/sass/*', ['compile:sass:development']);
   gulp.watch('app/js/*', ['compile:scripts:development']);
});