我试图在我的Gulp文件中利用Browserify,但似乎无论我如何设置,它总是抛出一个错误,读取"dest.write不是一个函数"。我最初使用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());
});
当我注释掉browserify()行时,一切正常。当我在谷歌上寻找解决这个错误信息的方法时,我发现了这个页面,有人链接到它,说"gulp文档对这个解决方案赞不绝口"(在这里):
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'));
});
我进一步挖掘,发现vinyl-transform
不能以这种方式与Browserify一起工作,因为没有写流,而首选的方法是使用vinyl-source-stream
。我现在正在尝试使用这个建议的解决方案,但仍然得到错误:
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());
});
以各种方式调整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', // 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'));
});