Gulp Equivalent (from Grunt) - Multiple src files

gruntjs, gulp

Solution

From the documentation:

globs

Type: `String` or `Array`

Glob or globs to read.

In other words, pass in an array of strings, like:

gulp.src(['file1.js', 'file2.js']).pipe(...)
//       ^                      ^
//       '-------- Array -------'

Please note that this is the exact same format as Grunt. It's an array of globs, not a comma-separated list.

Problem

I've been tinkering around with GulpJS and believe it's a good next step from Grunt, but am having a few issues with the syntax in comparison. Here is a section from my `Gruntfile.js`: ``` concat: { ie: { options: { separator: "\n\n" }, src: [ "bower_components/selectivizr/selectivizr.js", "bower_components/respond/dest/respond.min.js", "bower_components/REM-unit-polyfill/js/rem.js" ], dest: "assets/js/build/ie.js" }, dist: { options: { separator: "\n\n" }, src: [ // Foundation Vendor "bower_components/foundation/js/vendor/fastclick.js", "bower_components/foundation/js/vendor/placeholder.js", // Foundation Core "bower_components/foundation/js/foundation/foundation.js", "bower_components/foundation/js/foundation/foundation.abide.js", "bower_components/foundation/js/foundation/foundation.accordion.js", "bower_components/foundation/js/foundation/foundation.alert.js", "bower_components/foundation/js/foundation/foundation.clearing.js", "bower_components/foundation/js/foundation/foundation.dropdown.js", "bower_components/foundation/js/foundation/foundation.interchange.js", "bower_components/foundation/js/foundation/foundation.joyride.js", "bower_components/foundation/js/foundation/foundation.magellan.js", "bower_components/foundation/js/foundation/foundation.offcanvas.js", "bower_components/foundation/js/foundation/foundation.orbit.js", "bower_components/foundation/js/foundation/foundation.reveal.js", "bower_components/foundation/js/foundation/foundation.tab.js", "bower_components/foundation/js/foundation/foundation.tooltip.js", "bower_components/foundation/js/foundation/foundation.topbar.js", // Custom Vendor // Project "assets/js/src/_init.js" ], dest: "assets/js/build/scripts.js" } } ``` So as you can see, I'm specifying specific files (since I don't want to pull in an entire directory as you normally see it done), which seems simple enough. All tuts I've found for Gulp seem to follow that regex format: ``` gulp.task('scripts', function() { return gulp.src("assets/js/src/_init.js") .pipe(jshint('.jshintrc')) .pipe(jshint.reporter('default')) .pipe(concat('main.js')) .pipe(gulp.dest('assets/js/build')) .pipe(rename({ suffix: '.min' })) .pipe(uglify()) .pipe(livereload(server)) .pipe(gulp.dest('assets/js/build')) .pipe(notify({ message: 'Scripts task complete' })); }); ``` But putting in a comma-separated list into that `src` portion doesn't work -- how do we pass an array of files to that method? It looks like I can separate my IE specific scripts using multiple streams in one, like so: ``` gulp.task('test', function(cb) { return es.concat( gulp.src('bootstrap/js/*.js') .pipe(gulp.dest('public/bootstrap')), gulp.src('jquery.cookie/jquery.cookie.js') .pipe(gulp.dest('public/jquery')) ); }); ``` But a quick comment on if that is correct would be great too. Thanks!

Original source