5

I'm facing a 'randomly' occurring fatal error whilst using a watch task for gulp.

General setup
I'm on Windows 10, in which I host a Debian VM using VMWare. I have a network mapping directly into the app folder on the web server. As IDE, I use Atom, where I have opened said folder. This way, I'm directly working on the web server so that my many code changes do not require a deploy step.

Error
My build task is driven by gulp. Let me first show the error I'm facing:

W:\jd5>gulp watch
[16:21:10] Using gulpfile W:\jd5\gulpfile.js
[16:21:10] Starting 'watch'...
[16:21:11] 'watch' errored after 1.35 s
[16:21:11] Error: watch W:\jd5\src\js\vendor\ UNKNOWN
    at _errnoException (util.js:1022:11)
    at FSWatcher.start (fs.js:1374:19)
    at Object.fs.watch (fs.js:1400:11)
    at Gaze._watchDir (W:\jd5\node_modules\gaze\lib\gaze.js:289:30)
    at W:\jd5\node_modules\gaze\lib\gaze.js:358:10
    at iterate (W:\jd5\node_modules\gaze\lib\helper.js:52:5)
    at W:\jd5\node_modules\gaze\lib\helper.js:61:11
    at W:\jd5\node_modules\gaze\lib\gaze.js:420:5
    at iterate (W:\jd5\node_modules\gaze\lib\helper.js:52:5)
    at W:\jd5\node_modules\gaze\lib\helper.js:61:11
events.js:183
      throw er; // Unhandled 'error' event
      ^

Regarding the randomness of this error: I often face it when starting watch, but sometimes not. It's at about 50% fail rate. Sometimes I can develop an entire day without it occurring. It's a frustrating error as it completely blocks my workflow, and it only mentions "UNKNOWN".

Gulp task

This is the gulp file I currently use:

/* load plugins */
var gulp = require('gulp');

// fast libsass-based SCSS parser
var sass = require('gulp-sass');
var del = require('del');

/*  note that nano has a built-in auto prefixer, which we will use */
var nano = require('gulp-cssnano');
var gzip = require('gulp-gzip');
var minify = require('gulp-minify');

var babel = require("gulp-babel");
var sourcemaps = require('gulp-sourcemaps');

/* browser definition will be used by auto prefixer */
var myBrowsers = [
  'last 2 versions',
  'safari >= 8'
];

/* delete previously built files */
gulp.task('clean', function(cb) {
  del(['public/css/*.css', 'public/js/**/*.js'], cb);
});

/* STYLES
================================================================================
*/

/* compile SCSS styles into CSS */
gulp.task('styles', function () {
  return gulp.src('src/scss/**/*.scss')
    .pipe(sass().on('error', sass.logError))
    .pipe(nano({
      autoprefixer: {
        browsers: myBrowsers,
        add: true
      }
    }))
    .pipe(gzip({
      append: false
    }))
    .pipe(gulp.dest('public/css'));
});


/* SCRIPTS
================================================================================
*/

gulp.task('scripts', function() {
  gulp.start('scripts_global', 'scripts_vendor', 'scripts_modules')
    .on('error', function(err) {
      console.error('Error', err.message);
    });
});

/* src/js/*.js > these are global scripts. minify, gzip and move to public/js/*.js */
gulp.task('scripts_global', function() {
  return gulp.src('src/js/*.js')
    .pipe(minify({
      ext: {
        min: '.min.js'
      }
    }))
    .pipe(gzip({
      append: false
    }))
    .pipe(gulp.dest('public/js/'));
});

/* src/js/vendor/*.js > vendor scripts should already be minimized, so gzip and move to public/js/vendor/*.js */
gulp.task('scripts_vendor', function() {
  return gulp.src('src/js/vendor/*.js')
    .pipe(gzip({
      append: false
    }))
    .pipe(gulp.dest('public/js/vendor/'));
});

/* src/js/modules/*.js > module scripts should be transpiled to systemjs compatible modules, towards public/js/modules/*.js */
gulp.task("scripts_modules", function() {
  return gulp.src("src/js/modules/*.js")
    .pipe(sourcemaps.init())
    .pipe(babel())
    .pipe(sourcemaps.write('.'))
    .pipe(gzip({
      append: false
    }))
    .pipe(gulp.dest("public/js/modules"));
});

/* default task: first clean, then run styles and scripts build tasks */
gulp.task('default', ['clean'], function() {
  gulp.start('styles', 'scripts');
});


/* watch task to continuously build styles and scripts as they change in src dir */
gulp.task('watch', function() {

  // watch .scss files
  gulp.watch('src/scss/**/*.scss', ['styles']);

  // watch .js files
  gulp.watch('src/js/**/*.js', ['scripts']);

});

As the error itself provides no information on a possible cause, some speculations:

  • I consider it unlikely to be a permission problem on some file, because those would always fail, not just sometimes.
  • I am considering both Atom and this process touching files at the same time, but have no evidence for it, nor would I know how to prevent it. The process also sometimes fails with Atom not even open.
  • Note that running the individual tasks without watch (gulp styles, gulp scripts) works just fine, so the task themselves look OK, more likely I'm making a mistake in how they are linked up, but I don't know what it is.

I'm on Node v8.9.4. Here are the relevant parts of my package.json:

{
  "name": "",
  "version": "",
  "description": "",
  "author": "F",
  "license": "",
  "devDependencies": {
    "babel-plugin-transform-es2015-modules-systemjs": "^6.24.1",
    "babel-preset-env": "^1.7.0",
    "babel-preset-es2015": "^6.24.1",
    "gulp": "^3.9.1",
    "gulp-babel": "^6.1.2",
    "gulp-cssnano": "^2.1.3",
    "gulp-gzip": "^1.4.0",
    "gulp-minify": "0.0.15",
    "gulp-sass": "^3.2.1",
    "gulp-sourcemaps": "^2.6.0"
  },
  "dependencies": {
    "del": "^2.2.2",
    "eslint": "^4.19.1"
  }
}
Fer
  • 4,116
  • 16
  • 59
  • 102
  • Have you considered network issues might be causing the randomness of the error? – Justin Pearce May 30 '18 at 14:53
  • @JustinPearce Sure, but nothing points in that direction. Note that this is a host to VM virtual network connection which seems very stable. I never have issues with any other network-related service between the host and VM. – Fer May 30 '18 at 19:02

0 Answers0