Gulp类型错误：dest.on不是一个函数。

Question

我正在尝试使用 Gulp 任务生成一个 bundle.js 文件。

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'));
});

然而，当我尝试运行它时，会出现“TypeError: dest.on不是函数”的错误：

这是文件夹目录：

- McBooley

Answer 1

错误的原因是webpack无法直接处理gulp流。当然，由webpack（）返回的对象不包括dest.on，该对象是特定于gulp的。

要么使用gulp-webpack，要么按照官方文档中介绍的使用gulp与webpack的方法。

以下示例代码摘自官方文档，使用了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/'));
});

- marvinhagemeister

---

即使使用了 webpack-stream ，我仍然遇到了 dest.on 类型错误 :( - Roman M. Koss

@RomanM.Kos 刚刚再次尝试了我的示例。使用最新的 gulp、webpack 和 webpack-stream 包可以正常工作。 - marvinhagemeister

我已经升级了我的包，但似乎这并没有起到作用。 - realisation

我在一个VS 2017项目中实现了这个功能，但在另一个项目中没有。比较结果显示，在其中一个项目中，我使用括号进行了管道操作，而在另一个项目中则没有。正常工作的代码：tsProject.src().pipe(debug()).pipe(tsProject()).pipe(debug()).pipe(gulp.dest...) 不正常工作的代码：tsProject.src().pipe(debug).pipe(tsProject).pipe(debug).pipe(gulp.dest.. - StingyJack