2016-07-05 40 views
0

我創建了以下咕嘟咕嘟任務:添加Browserify現有咕嘟咕嘟任務

var gulp  = require('gulp'); 
var gulputil = require('gulp-util'); 
var gulpif  = require('gulp-if'); 
var sourcemaps = require('gulp-sourcemaps'); 
var uglify  = require('gulp-uglify'); 

var scriptInput = './resources/assets/scripts/*.js'; 

gulp.task('scripts', function() { 
    var production = gulputil.env.production ? true : false; 
    return gulp.src(scriptInput) 
     .pipe(gulpif(!production, sourcemaps.init())) 
     .pipe(gulpif(!production, sourcemaps.write())) 
     .pipe(gulpif(production, uglify(options.uglify))) 
     .pipe(gulp.dest(scriptOutput)) 
     .on('error', gulputil.log); 
}); 

此任務需要的所有腳本在我的腳本目錄並編譯它們。取決於我是否將生產標誌傳遞給了我的gulp命令,它將生成源映射或uglify生成的腳本。到現在爲止還挺好。

雖然我的任務中缺少一件事,那就是Browserify。我仍然是Gulp的新手,我無法將自己的頭腦融入到我現有的任務中。我已經看到了一些關於如何做到這一點的例子(許多人使用黑名單gulp-browserify包),但這些看起來更復雜,而且與我使用的任務截然不同。這些示例中的另一個限制是它們似乎不支持使用像我使用的通配符路徑(請參閱示例中的變量scriptInput)。

我的問題是:是否有一種簡單的方法可以將Browserify添加到此任務中,而不會丟失原始任務的功能,尤其是使用通配符源路徑的功能?

回答

0

首先,你需要包括browserify,那麼你就在我的下面的示例如下這樣使用它,在這裏我使用vuiefy轉化VUE文件,是的,你可以看到我也有需要fs

...(some more require here) 
var fs = require("fs"); 
var browserify = require('browserify'); 
var vueify = require('vueify'); 
// Compile Our Vue js 
gulp.task('vueify', function() { 
    return browserify(srcpath +'js/app.js') 
    .transform(vueify) 
    .bundle() 
    .pipe(fs.createWriteStream(destpath +"js/build.js")) 

}); 
+0

謝謝你你的答案。不幸的是,這似乎不適用於我原來的問題。 (「我的問題是:是否有一種簡單的方法可以將Browserify添加到此任務中,而不會丟失原始任務的功能,特別是使用通配符源路徑的功能?」) –