Gulp not watching files with gulp-watch plugin -


i'm trying rebuild files change in gulpfile.js using recipe via gulp-watch plugin. problem when run default task gulp, doesn't watch files @ after saving of files want watch. doing wrong here in gulpfile.js? in advance.

/* ----------------------------------------------------- */ /* gulpfile.js /* ----------------------------------------------------- */ 'use strict';  // setup modules/gulp plugins var gulp            = require('gulp'),     del             = require('del'),     runsequence     = require('run-sequence'),     less            = require('gulp-less'),     // minifycss        = require('gulp-minify-css'),     fileinclude     = require('gulp-file-include'),     order           = require('gulp-order'),     concat          = require('gulp-concat'),     uglify          = require('gulp-uglify'),     sourcemaps      = require('gulp-sourcemaps'),     imagemin        = require('gulp-imagemin'),     pngquant        = require('imagemin-pngquant'),     plumber         = require('gulp-plumber'),     watch           = require('gulp-watch'),     // browserify   = require('browserify'),     // sourcestream = require('vinyl-source-stream'),     connect         = require('gulp-connect');  // configure file paths var path = {     dest: 'dist/',     src: 'src/',     includes: 'include/',     less_src: 'src/frontend/less/',     less_manifest: 'src/frontend/less/all.less',     css_dest: 'dist/frontend/css/',     js_src: 'src/frontend/js/',     js_minified_out: 'all.js',     js_dest: 'dist/frontend/js',     img_src: 'src/frontend/img/',     img_dest: 'dist/frontend/img/', };  // clean out build folder each time gulp runs gulp.task('clean', function (cb) {     del([         path.dest     ], cb); });  // compile less gulp.task('less', function(){     return gulp.src(path.less_manifest)         .pipe(watch(path.less_manifest))         .pipe(plumber({             handleerror: function (err) {                 console.log(err);                 this.emit('end');             }         }))         .pipe(sourcemaps.init())         .pipe(less())         .pipe(sourcemaps.write('./'))         .pipe(gulp.dest(path.css_dest))         .pipe(connect.reload()); });  // allow html files included gulp.task('html', function() {     return gulp.src([path.src + '*.html'])         .pipe(watch(path.src + '*.html'))         .pipe(plumber({             handleerror: function (err) {                 console.log(err);                 this.emit('end');             }         }))         .pipe(fileinclude({             prefix: '@@',             basepath: path.includes         }))         .pipe(gulp.dest(path.dest))         .pipe(connect.reload()); });  // concatenate , minify javascript gulp.task('js', function() {     return gulp.src(path.js_src + '**/*.js')         .pipe(watch(path.js_src + '**/*.js'))         .pipe(order([             path.js_src + 'framework/*.js',             path.js_src + 'vendor/*.js',             path.js_src + 'client/*.js'         ], {base: '.'} ))         .pipe(concat(path.js_minified_out))         .pipe(uglify())         .pipe(gulp.dest(path.js_dest))         .pipe(connect.reload()); });  // minify images gulp.task('imagemin', function () {     return gulp.src(path.img_src + '**/*')         .pipe(imagemin({             progressive: true,             use: [pngquant()]         }))         .pipe(gulp.dest(path.img_dest)); });  // copy folders gulp.task('copy', function() {     gulp.src(path.src + 'extjs/**/*')         .pipe(gulp.dest(path.dest + 'extjs/'));     // copy bower components build folder     gulp.src('bower_components/**/*')         .pipe(gulp.dest('dist/bower_components/')); });  // connect server , livereload pages gulp.task('connect', function() {     connect.server({         root: path.dest,         livereload: true     }); });  // organize build tasks 1 task gulp.task('build', ['less', 'html', 'js', 'imagemin', 'copy']); // organize server tasks 1 task gulp.task('server', ['connect']);  // default task gulp.task('default', function(cb) {     // clean out dist/ folder before else     runsequence('clean', ['build', 'server'],         cb); }); 

try , remove watch build tasks, , have separate tasks handle watching. like:

gulp.task("watch-less", function() {     watch(path.less_manifest, function () {         gulp.start("less");     )); }); 

that way, it'll trigger task when file changes. , task watching able run separate build (which make life easier if use form of build automation).

also, can specify many watch tasks, so:

gulp.task("watch", function() {     watch(paths.foo, function() {         gulp.start("foo");     });      watch(paths.bar, function() {         gulp.start("bar");     }); }); 

Comments

Popular posts from this blog

twig - Using Twigbridge in a Laravel 5.1 Package -

jdbc - Not able to establish database connection in eclipse -

Kivy: Swiping (Carousel & ScreenManager) -