title: gulp.watch() not working with ftp update
body: <p>I have recently learnt gulp and scripted this gulp script on my local computer, so that it can watch for any changes, and compile my javascripts (in this case, <code>./js/main.js</code> with its dependencies) into a single file <code>./js/bundle.js</code>:</p>
  
  <pre><code>var gulp = require('gulp');
  // Plugins
  var jshint = require('gulp-jshint');
  var browserify = require('gulp-browserify');
  var rename = require('gulp-rename');
  
  // Lint Task
  gulp.task('lint', function() {
    return gulp.src(['./js/**/*.js', '!./js/bundle.js'])
      .pipe(jshint())
      .pipe(jshint.reporter('default'));
  });
  
  // browserify task
  gulp.task('b', function() {
    gulp.src('js/main.js')
      .pipe(browserify())
      .pipe(rename('bundle.js'))
      .pipe(gulp.dest('js/'));
  
  });
  
  // Watch Files For Changes
  gulp.task('watch', function() {
    gulp.watch(['./js/*.js', './js/**/*.js', '!./js/bundle.js'], ['lint', 'b'])
      .on('change', function(event) {
        console.log("\n============");
        console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');
      });
  });
  
  // Default Task
  gulp.task('default', ['lint', 'watch']);
  </code></pre>
  
  <p>It runs well on my local computer (Windows 7), so I tried putting it to my remote Ubuntu server, and let it watch for any ftp updates and browserify them.</p>
  
  <p>In other words, I want to code remotely and update <code>./js/main.js</code> through ftp, and have gulp watch for the changes and browserify it automatically.</p>
  
  <p>The problem is: Gulp recognizes the change and logged on the console:</p>
  
  <pre><code>File /home/wordpress/public_html/cm/mobileCoder02/src/js/main.js was changed, running tasks...
  [09:27:47] Starting 'lint'...
  [09:27:47] Starting 'b'...
  [09:27:47] Finished 'b' after 34 Î¼s
  [09:27:47] Finished 'lint' after 6.71 ms
  </code></pre>
  
  <p>But the output file, <code>bundle.js</code> contains nothing but the module loader script:</p>
  
  <pre><code>(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&amp;&amp;require;if(!u&amp;&amp;a)return a(o,!0);if(i)return i(o,!0);throw new Error("Cannot find module '"+o+"'")}var f=n[o]={exports:{}};t[o][0].call(f.exports,function(e){var n=t[o][1][e];return s(n?n:e)},f,f.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&amp;&amp;require;for(var o=0;o&lt;r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
  
  },{}]},{},[1])
  </code></pre>
  
  <p>If I change the task to</p>
  
  <pre><code>// browserify task
  gulp.task('b', function() {
    setTimeout(function() {
      gulp.src('js/main.js')
        .pipe(browserify())
        .pipe(rename('bundle.js'))
        .pipe(gulp.dest('js/'));
    }, 1000);
  
  });
  </code></pre>
  
  <p>Then the code runs OK.</p>
  
  <p>I would like to ask why it have to wait for some time before browserifying. Shouldn't <code>gulp.watch()</code> be firing 'change' event after the ftp transfer is finished? If not, shouldn't it be at least using the old version?</p>
  
  <p>Thank you.</p>