webpack-stream: Errors in `webpack` break the pipe / task

@ArnaudRinquin - Ran into this same issue. It’s a gulp issue I think. There’s a good explanation in https://github.com/gulpjs/gulp/issues/259. The following worked for me:

  return gulp.src('webclient/index.js')
    .pipe(gulpWebpack(webpackConfig, webpack))
    .on('error', function handleError() {
      this.emit('end'); // Recover from errors
    })
    .pipe(gulp.dest('webclient-dist/static'));

I’m not sure. I don’t use plumber or the watch option with webpack.

I have the same problem as @krzysieki

-> Save, webpack compiles fine -> Save with a syntax error, webpack outputs error, “Cannot find module” error in browser -> Fix error, save, webpack says it’s compiled fine, but file is not updated and missing module error persists

So basically the watch works fine as long as I never save with an error. If I do, I have to relaunch the gulp script.

@shama - You might want to consider re-opening this as a documentation issue. Anyone using the watch option will need an .on('error', ...) handler.

return gulp.src(paths.scripts.src, {sourcemaps: true})
    .pipe(
      webpack(webpackConfig)
        .on('error', (err) => {
          console.log(err.message);
          this.emit('end'); // Recover from errors
        })
    );

#126 did not help me. Exact same problem: files are never written after an error.

+1 to @CezaryDanielNowak using .on right after the webpack-stream will allow the error to trigger but resume the watch process. Just make sure you emit and end from the catch:

gulp.task('webpack', () => {

    return gulp.src(config.webpack.paths)
        .pipe(plugins.vinylNamed())
        .pipe(plugins.webpackStream(webpackConfig))
        .on('error', function(error) {
            plugins.util.log(plugins.util.colors.red(error.message));
            this.emit('end');
        })       
        .pipe(gulp.dest(config.dist + '/scripts'))
    ;
});

note the use of a normal function there, its to keep scope on this when running this.emit(‘end’) using an arrow function in the .on(‘error’) callback will break the scope of this due to lexical scoping.

I fixed it by changing:

  gulp.src('app.js')
  .pipe(webpack(webpackConfig, webpackSync, webpackCallback))
  .on('error', (err) => {
    gutil.log('WEBPACK ERROR', err);
  })
  .pipe(gulp.dest('dest/'));

into:

  gulp.src('app.js')
  .pipe(
    webpack(webpackConfig, webpackSync, webpackCallback)
    .on('error', (err) => {
      gutil.log('WEBPACK ERROR', err);
    })
  )
  .pipe(gulp.dest('dest/'));

@aldendaniels is everything ok after recovering? For me gulp is recovering well, watches and compiles files (judging by logs) but doesn’t overwrite result files.

I have the same problem.

Closing as I don’t think this is an issue with this task. If it is, let me know when an example that reproduces. Thanks!

If it is, let me know when an example that reproduces. Thanks!

Really annoying issue. I knew that some time ago there was no such a problem and after some research found that in webpack-stream@2.1.1 it is working correctly.

So for me downgrading resolved issue and webpack-stream@2.1.1 compiles typescript and does not crash on errors, but it is sad that newer versions cant handle errors correctly