Gulp TypeError: dest.on is not a function

Question

I'm trying to generate a bundle.js file with a Gulp task

var gulp = require('gulp'),
    gutil = require('gulp-util'),
    wrench = require('wrench'),
    conf = require('./webpack.config'),
    webpack = require('webpack'),
    WebpackDevServer = require('webpack-dev-server');

// Webpack
gulp.task('wp', function() {
  return gulp.src('./assets/scripts/entry.js')
    .pipe(webpack(conf))
    .pipe(gulp.dest('./assets/build1'));
});

However, I get TypeError: dest.on is not a function when I try to run it:

Here's the folder directory:

Answer 1

The error occurs because webpack doesn't work natively with gulp streams. Naturally the returned object by webpack() doesn't include dest.on which is specific to gulp.

Either use gulp-webpack or follow the official docs on how to use webpack with gulp

Sample code taken straight out of the official docs which uses webpack-stream:

var gulp = require('gulp');
var webpack = require('webpack-stream');

gulp.task('default', function() {
  return gulp.src('src/entry.js')
    .pipe(webpack())
    .pipe(gulp.dest('dist/'));
});