Comment appeler des tâches dans gulp avec rechargement en direct - après que des modifications de fichiers ont eu lieu

Question

J'ai défini dans un fichier gulp, la tâche suivante :

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

Ce n'est que récemment que j'ai réalisé qu'il était idéal uniquement pour les choses statiques comme le HTML.Parce que j'utilise Sass et que l'application est principalement js.Je voudrais appeler certaines tâches que j'ai prédéfinies pour recompiler les js et les css en cas de modification de ceux-ci.

La façon dont j'ai appelé les tâches est la suivante :

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

Mais je veux que les tâches soient accomplies lors du changement.Des idées ?

Answer 1

Vous devriez continuer à utiliser livereload tout comme vous le faites, à des fins d'actualisation du navigateur.Si vous souhaitez réexécuter certaines tâches lors d'un changement, je pense que gulp.watch est la solution simple et intégrée.

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

Ou des tâches plus spécifiques :

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

Exemple d'un watch tâche qui définit certains watchers avec différent tasks :

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