Jshint crashing gulp when a javascript error occurs

sage
1

Hi all,

When I have an error in my javascript, jshint crashes my gulp watch script and I need to restart it in order to continue working. It’s quite frustrating and I’m sure a few people have also encountered this issue.

Could someone recommend a solution which would just display the error and not build the javascript, instead of crashing the gulp watch process please?

➜  my_theme git:(master) ✗ gulp watch
[08:29:32] Using gulpfile ~/Development/my_website/site/web/app/themes/my_theme/gulpfile.js
[08:29:32] Starting 'watch'...
[08:29:32] Finished 'watch' after 54 ms
[BS] Proxying: http://my_website.dev
[BS] Access URLs:
 ---------------------------------------
       Local: http://localhost:3000
    External: http://192.168.17.129:3000
 ---------------------------------------
          UI: http://localhost:3001
 UI External: http://192.168.17.129:3001
 ---------------------------------------
[BS] Watching files...
[08:29:38] Starting 'jshint'...

assets/scripts/main.js
  line 78  col 25  Expected an identifier and instead saw '.'.
  line 78  col 25  Expected an assignment or function call and instead saw an expression.
  line 78  col 26  Missing semicolon.

  ✖  2 errors
  ⚠  1 warnings

[08:29:38] Finished 'jshint' after 305 ms
[08:29:38] Starting 'scripts'...

stream.js:94
      throw er; // Unhandled stream error in pipe.
            ^
Error
    at new JS_Parse_Error (eval at <anonymous> (/home/james/Development/my_website/site/web/app/themes/my_theme/node_modules/gulp-uglify/node_modules/uglify-js/tools/node.js:24:4), <anonymous>:1526:18)
    at js_error (eval at <anonymous> (/home/james/Development/my_website/site/web/app/themes/my_theme/node_modules/gulp-uglify/node_modules/uglify-js/tools/node.js:24:4), <anonymous>:1534:11)
    at croak (eval at <anonymous> (/home/james/Development/my_website/site/web/app/themes/my_theme/node_modules/gulp-uglify/node_modules/uglify-js/tools/node.js:24:4), <anonymous>:2026:9)
    at token_error (eval at <anonymous> (/home/james/Development/my_website/site/web/app/themes/my_theme/node_modules/gulp-uglify/node_modules/uglify-js/tools/node.js:24:4), <anonymous>:2034:9)
    at unexpected (eval at <anonymous> (/home/james/Development/my_website/site/web/app/themes/my_theme/node_modules/gulp-uglify/node_modules/uglify-js/tools/node.js:24:4), <anonymous>:2040:9)
    at eval (eval at <anonymous> (/home/james/Development/my_website/site/web/app/themes/my_theme/node_modules/gulp-uglify/node_modules/uglify-js/tools/node.js:24:4), <anonymous>:2130:17)
    at eval (eval at <anonymous> (/home/james/Development/my_website/site/web/app/themes/my_theme/node_modules/gulp-uglify/node_modules/uglify-js/tools/node.js:24:4), <anonymous>:2073:24)
    at block_ (eval at <anonymous> (/home/james/Development/my_website/site/web/app/themes/my_theme/node_modules/gulp-uglify/node_modules/uglify-js/tools/node.js:24:4), <anonymous>:2353:20)
    at eval (eval at <anonymous> (/home/james/Development/my_website/site/web/app/themes/my_theme/node_modules/gulp-uglify/node_modules/uglify-js/tools/node.js:24:4), <anonymous>:2120:29)
    at eval (eval at <anonymous> (/home/james/Development/my_website/site/web/app/themes/my_theme/node_modules/gulp-uglify/node_modules/uglify-js/tools/node.js:24:4), <anonymous>:2073:24)
    at if_ (eval at <anonymous> (/home/james/Development/my_website/site/web/app/themes/my_theme/node_modules/gulp-uglify/node_modules/uglify-js/tools/node.js:24:4), <anonymous>:2336:44)

`

2

I was helping someone out earlier with a similar issue. Did you do anything out of ordinary?

Our errors were a tad different, but I assumed it was because we installed an older theme into a newer version of Tellis/Bedrock.

What eventually fixed it I believe was a vagrant destroy. Then made sure the etc/hosts file was clean. Then we vagrant’ed back up.

Ran gulp, then gulp watch- and it worked.

Maybe I’m forgetting one crucial step we did, but I think that was it, let me know if that works. It’s confusing, I don’t know why that fixed ‘gulp watch’ but it was working fine after that.

3

It’s an error related to the gulp pipeline not handing errors for jshint, which results in gulp crashing. It’s for the sage theme, I’m using the latest version from github.

4

By default, Plumber is not piped in your scripts task but it’s already included in the packages loaded via npm.
You can replace your scripts task with the following

var onError = function (err) {
  console.log(err.toString());
   this.emit('end');
};

gulp.task('scripts', ['jshint'], function() {
  var merged = merge();
  manifest.forEachDependency('js', function(dep) {
    merged.add(
      gulp.src(dep.globs, {base: 'scripts'})
        .pipe(plumber({ errorHandler: onError }))
        .pipe(jsTasks(dep.name))
    );
  });
  return merged
    .pipe(writeToManifest('scripts'));
});
2 Likes
5

Perfect, thanks very much Nicolo.

6

Nicolo’s solution should be standard in the Sage gulpfile.

Any reason why it isn’t? I can’t imagine having it crashing and forcing the dev to run gulp watch manually each time is more efficient :stuck_out_tongue:

7

I think the dev focus is now on Sage 9, which no longer uses Gulp. But I’m sure they’d look at a pull request if you made one!

8

If someone wants to PR the 8.5.0 branch with:

We’d be open to accepting it and tagging a maintenance release. The 8.x branch also could use a bump on the Bootstrap 4 alpha version.

9

On it: https://github.com/roots/sage/pull/1779