Gulp和Browserify总是给“dest.write不是函数”错误 [英] Gulp and Browserify always giving "dest.write is not a function" error

问题描述

我试图在我的Gulp文件中使用Browserify，但似乎无论如何设置它，它总是会抛出一个错误，指出dest.write不是函数。我最初使用gulp-concat开始执行这个任务：
$ b $ pre $ g $ g $ gulp.task（'scripts'，function（）
{
return gulp.src（['src / shared / js / one.js'，'src / shared / js / two.js'，'src / shared / js / *。js']）
.pipe（browserify（）
.pipe（concat（'main.js'））
.pipe（gulp.dest（'dist / js'））
.pipe（browserSync .stream（））;
}）;

当我将browserify行，一切正常。当搜索错误信息的解决方案时，我发现这个页面，当有人链接到它时，说这个解决方案的消费者大肆宣传（ here）：

  var gulp = require（'gulp'）; 
 var browserify = require（'browserify'）; 
 var transform = requi re（'vinyl-transform'）; 
 var uglify = require（'gulp-uglify'）; 
 $ b gulp.task（'browserify'，function（）{
 var browserified = transform（函数（文件名）{
 var b = browserify（文件名）; 
返回b.bundle（）; 
}）; 
 
 return gulp.src（['./ src / *。js']）
 .pipe（browserified）
 .pipe（uglify（））
 .pipe（gulp.dest（'./ dist'））; 
}）; 
  

我进一步挖掘并阅读 vinyl-transform 不以这种方式与Browserify一起工作，因为没有写入流，而且首选方法是使用 vinyl-source-stream 代替。我现在正在尝试使用这个建议的解决方案，但仍然出现错误：

  gulp.task（'scripts'， （）'src / shared / js / two.js'，'src / shared / js / * .js']）
 .pipe（browserify（'src / shared / js / *。js'，{
 debug：true，
 extensions：['.js'] $ b $ （）（））
 .ipe（buffer（））
 .pipe（gulp.dest（'main.js'））
 .bundle 'dist / js'））
.pipe（browserSync.stream（））; 
}）; 
  

以各种方式调整browserify（）引用并没有改变任何东西。任何人都可以告诉我我做错了什么？

解决方案

这个解决方案适用于我完全相同的情况。
我花了一段时间试图用browserify制作乙烯基转换，但没有成功，所以不得不恢复乙烯基源流和乙烯基缓冲液组合。

我使用以下要点作为我的代码片段的基本参考：
https：// gist.github.com/stoikerty/cfa49330a9609f6f8d2d

  var gulp = require（'gulp'）; 
 var source = require（'vinyl-source-stream'）; 
 var buffer = require（'vinyl-buffer'）; 
 var browserify = require（'browserify'）; 
 var uglify = require（'gulp-uglify'）; 
 
 gulp.task（'browserify'，function（）{
 var b = browserify（{
 entries：'./js/test.js'，//只需要初始文件，browserify找到deps 
 debug：true //启用sourcemaps 
}）; 
 
返回b.bundle（）
 .pipe（source（'。 /js/test.js'））// browserify的目标文件，相对于gulp.dest 
 .pipe（buffer（））
 .pipe（uglify（））
 .pipe gulp.dest（'./ dist'））; 
}）; 
  

I'm trying to utilize Browserify in my Gulp file, but it seems no matter how I set things up, it always throws an error that reads "dest.write is not a function". I originally started with this task using gulp-concat:

gulp.task('scripts', function()
{
    return gulp.src(['src/shared/js/one.js', 'src/shared/js/two.js', 'src/shared/js/*.js'])
        .pipe(browserify()
        .pipe(concat('main.js'))
        .pipe(gulp.dest('dist/js'))
        .pipe(browserSync.stream());
});

When I commented out the browserify() line, everything worked fine. While Googling around for a solution to the error message, I found this page when someone linked to it, saying "the gulp docs rave about this solution" (here):

var gulp = require('gulp');
var browserify = require('browserify');
var transform = require('vinyl-transform');
var uglify = require('gulp-uglify');

gulp.task('browserify', function () {
  var browserified = transform(function(filename) {
    var b = browserify(filename);
    return b.bundle();
  });

  return gulp.src(['./src/*.js'])
    .pipe(browserified)
    .pipe(uglify())
    .pipe(gulp.dest('./dist'));
});

I dug further, and read that vinyl-transform doesn't work with Browserify in this way because there is no write stream, and the preferred method was to use vinyl-source-stream instead. I'm now currently trying to use this proposed solution, but still getting the error:

gulp.task('scripts', function()
{
    return gulp.src(['src/shared/js/one.js', 'src/shared/js/two.js', 'src/shared/js/*.js'])
        .pipe(browserify('src/shared/js/*.js', {
            debug: true, 
            extensions: ['.js']
        }))
        .bundle()
        .pipe(source('main.js'))
        .pipe(buffer())
        .pipe(gulp.dest('dist/js'))
        .pipe(browserSync.stream());
});

Tweaking the browserify() reference in various ways has not changed anything. Can anyone tell me what I'm doing wrong?

解决方案

Here's the solution that worked for me in exactly same situation. I spent some time trying to make vinyl-transform work with browserify, without success, so had to revert to vinyl-source-stream and vinyl-buffer combination.

I used the following gist as a base reference for my code snippet: https://gist.github.com/stoikerty/cfa49330a9609f6f8d2d

var gulp = require('gulp');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var browserify = require('browserify');
var uglify = require('gulp-uglify');

gulp.task('browserify', function () {
  var b = browserify({
    entries: './js/test.js', // Only need initial file, browserify finds the deps
    debug: true        // Enable sourcemaps
  });

  return b.bundle()
    .pipe(source('./js/test.js')) // destination file for browserify, relative to gulp.dest
    .pipe(buffer())
    .pipe(uglify())
    .pipe(gulp.dest('./dist'));
});

这篇关于Gulp和Browserify总是给“dest.write不是函数”错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！