我正在将项目中的任务运行器从咕unt声更改为gulp,并且在复制以下任务时遇到麻烦:
module.exports = function(grunt) {
grunt.initConfig({
browserify: {
app: {
src: ["./app/**/*.js", "./app/**/*.html"],
dest: "./temp/app.js",
options: {
browserifyOptions: { debug: true },
transform: [
["babelify", { "presets": ["es2015"] }],
["stringify", { appliesTo: { includeExtensions: [".html"] }, minify: true}]
]
}
}
}
});
);
那里有一些指南,可以使用Vinyl-source-stream,glob等创建具有多个入口点的任务,但是它们也都创建了多个输出,例如以下任务:
gulp.task("app", function(done) {
glob("./app/**/*.{js,html}", function (err, files) {
if (err) done(err);
var tasks = files.map(function (entry) {
return browserify({
entries: [entry],
transform: [
["babelify", { "presets": ["es2015"] }],
["stringify", { appliesTo: { includeExtensions: [".html"] }, minify: true }]
]
})
.bundle()
.pipe(source(entry))
.pipe(gulp.dest("./temp"));
});
es.merge(tasks).on("end", done);
});
});
我应该如何更改gulp任务以得到与grunt相同的结果(一个.js文件输出)?
编辑: 经过一番挖掘,我自己找到了一个解决方案...首先,您需要编辑一个文件(在我的情况下为app.js),并为要捆绑的每个文件调用import ...,然后将gulp修改为如下:
gulp.task("app", function () {
return browserify({
debug:true,
entries: ["./app/app.js"],
transform: [
["babelify", { "presets": ["es2015"] }],
["stringify", { appliesTo: { includeExtensions: [".html"] }, minify: true }]
]
})
.bundle()
.on("error", function (err) { console.error(err); this.emit("end"); })
.pipe(source("app.js"))
.pipe(buffer())
.pipe(gulp.dest("./temp"))
.pipe(uglify())
.pipe(rename({ extname: ".min.js"}))
.pipe(gulp.dest("./temp"));
});
在这种情况下,它既输出app.js,也输出其最小版本-app.min.js