我正在使用gulp中的Browserify。我试图将我的测试编译到一个单独的文件中。但与我的主应用程序不同，我遇到了编译测试的问题。主要区别在于测试有多个入口点，而不像应用程序那样只有一个入口点。但是，Browserify报错说找不到入口点。
browserify = require 'browserify'
gulp = require 'gulp'
source = require 'vinyl-source-stream'
gulp.task 'tests', ->
browserify
entries: ['./app/js/**/*Spec.coffee']
extensions: ['.coffee']
.bundle
debug: true
.pipe source('specs.js')
.pipe gulp.dest('./specs/')
以下是我构建的一个任务，似乎可以解决这个问题。基本上，我使用一个外部库将文件名收集为数组。然后将该数组作为入口点传递。
'use strict;'
var config = require('../config');
var gulp = require('gulp');
var plumber = require('gulp-plumber');
var glob = require('glob');
var browserify = require('browserify');
var source = require('vinyl-source-stream');
gulp.task('tests', function(){
var testFiles = glob.sync('./spec/**/*.js');
return browserify({
entries: testFiles,
extensions: ['.jsx']
})
.bundle({debug: true})
.pipe(source('app.js'))
.pipe(plumber())
.pipe(gulp.dest(config.dest.development));
});
这里是一份替代食谱，更符合使用 gulp.src() 的 gulp 风格。
var gulp = require('gulp');
var browserify = require('browserify');
var transform = require('vinyl-transform');
var concat = require('gulp-concat');
gulp.task('browserify', function () {
// use `vinyl-transform` to wrap around the regular ReadableStream returned by b.bundle();
// so that we can use it down a vinyl pipeline as a vinyl file object.
// `vinyl-transform` takes care of creating both streaming and buffered vinyl file objects.
var browserified = transform(function(filename) {
var b = browserify(filename, {
debug: true,
extensions: ['.coffee']
});
// you can now further configure/manipulate your bundle
// you can perform transforms, for e.g.: 'coffeeify'
// b.transform('coffeeify');
// or even use browserify plugins, for e.g. 'minifyiy'
// b.plugins('minifyify');
// consult browserify documentation at: https://github.com/substack/node-browserify#methods for more available APIs
return b.bundle();
});
return gulp.src(['./app/js/**/*Spec.coffee'])
.pipe(browserified)/
.pipe(concat('spec.js'))
.pipe(gulp.dest('./specs'));
});
gulp.task('default', ['browserify']);
关于这个工作的更多详细信息，请参阅我撰写的文章：http://medium.com/@sogko/gulp-browserify-the-gulp-y-way-bb359b3f9623
b.plugin("minifyify", opts)，但是当我尝试这样做时，它会导致流错误，如 TypeError: Object #<Readable> has no method 'write'。没有插件时，转换可以正常工作，因此我认为 minifyify 和 vinyl-transform 之间存在不兼容性。 - superEb一个稍微复杂的例子，使用glob模式将文件构建成多个文件，并监视和重建分离的文件。不适用于.coffee，而是适用于es2015，但差别不大：
var gulp = require("gulp");
var babelify = require("babelify");
var sourcemaps = require("gulp-sourcemaps");
var gutil = require("gulp-util");
var handleErrors = require("../utils/handleErrors.js");
var browserify = require("browserify");
var eventStream = require("event-stream");
var glob = require("glob");
var source = require("vinyl-source-stream");
var buffer = require("vinyl-buffer");
var watchify = require("watchify");
var SRC_PATH = "./src";
var BUILD_PATH = "./build";
var bundle = function (bundler, entryFilepath) {
console.log(`Build: ${entryFilepath}`);
return bundler.bundle()
.on("error", handleErrors)
.pipe(source(entryFilepath.replace(SRC_PATH, BUILD_PATH)))
.pipe(buffer())
.on("error", handleErrors)
.pipe(
process.env.TYPE === "development" ?
sourcemaps.init({loadMaps: true}) :
gutil.noop()
)
.on("error", handleErrors)
.pipe(
process.env.TYPE === "development" ?
sourcemaps.write() :
gutil.noop()
)
.on("error", handleErrors)
.pipe(gulp.dest("."))
.on("error", handleErrors);
};
var buildScripts = function (done, watch) {
glob(`${SRC_PATH}/**/[A-Z]*.js`, function (err, files) {
if (err) {
done(err);
}
var tasks = files.map(function (entryFilepath) {
var bundler = browserify({
entries: [entryFilepath],
debug: process.env.TYPE === "development",
plugin: watch ? [watchify] : undefined
})
.transform(
babelify,
{
presets: ["es2015"]
});
var build = bundle.bind(this, bundler, entryFilepath);
if (watch) {
bundler.on("update", build);
}
return build();
});
return eventStream
.merge(tasks)
.on("end", done);
});
};
gulp.task("scripts-build", function (done) {
buildScripts(done);
});
gulp.task("scripts-watch", function (done) {
buildScripts(done, true);
});
这里是完整的代码https://github.com/BigBadAlien/browserify-multy-build
首先，您可以编写一个suite.js文件来要求运行所有测试，并将它们browserify化。
您可以从我的项目https://github.com/mallim/sbangular中看到两个示例。
一个示例是针对grunt-mocha-phantomjs的。
https://github.com/mallim/sbangular/blob/master/src/main/resources/js/suite.js
一个Protractor的示例。https://github.com/mallim/sbangular/blob/master/src/main/resources/js/suite.js
这只是一个开始，我相信还有更多花哨的方法可用。
var testFiles = glob.sync('./spec/**/*.js');对我来说很管用，而不是使用glob(paths.js+'/**.js', function(err, widgetFiles) {...。+1 - Aamir Afridi