CODEWITHSUNDEEP
gulpbower
Yi Zhou
Yi Zhou

Reputation: 813

Gulp: How to concat bower components after all libs been download?

I'm using "gulp-bower" to auto install all the libs from bower.json, I also want gulp to minify all libs once it's been download. This is my code: 

var gulp = require('gulp'); 
var sass = require('gulp-sass');
var concat = require('gulp-concat');
var bower = require('gulp-bower');
var mainBowerFiles = require('main-bower-files');

gulp.task('bower', function() {
    return bower()
        .pipe(gulp.dest("./bower_components"))
});

gulp.task('minifyBower', function() {
    return gulp.src(mainBowerFiles())
        .pipe(concat('lib.js'))
        .pipe(gulp.dest('dist'))
});

gulp.task('default', ['bower','minifyBower']);

If I run this I got this error.

Starting 'bower'...
[11:23:06] Using cwd:  /Users/yizhou/Documents/Yi
[11:23:06] Using bower dir:  ./bower_components
[11:23:06] Starting 'minifyBower'...
[11:23:06] 'minifyBower' errored after 1.53 ms
[11:23:06] Error: Bower components directory does not exist at /Users/yizhou/Documents/Yi/bower_components
    at Error (native)
    at module.exports (/Users/yizhou/Documents/Yi/node_modules/main-bower-files/lib/index.js:76:71)
    at Gulp.<anonymous> (/Users/yizhou/Documents/Yi/gulpfile.js:16:21)
    at module.exports (/Users/yizhou/Documents/Yi/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:34:7)
    at Gulp.Orchestrator._runTask (/Users/yizhou/Documents/Yi/node_modules/gulp/node_modules/orchestrator/index.js:273:3)
    at Gulp.Orchestrator._runStep (/Users/yizhou/Documents/Yi/node_modules/gulp/node_modules/orchestrator/index.js:214:10)
    at Gulp.Orchestrator.start (/Users/yizhou/Documents/Yi/node_modules/gulp/node_modules/orchestrator/index.js:134:8)
    at /usr/local/lib/node_modules/gulp/bin/gulp.js:129:20
    at process._tickCallback (node.js:355:11)
    at Function.Module.runMain (module.js:503:11)
[11:23:06] bower cached git://github.com/jquery/jquery.git#2.1.4
[11:23:06] bower validate 2.1.4 against git://github.com/jquery/jquery.git#~2.1.4
[11:23:07] bower install jquery#2.1.4
[11:23:08] Finished 'bower' after 2 s

Upvotes: 2

Views: 447

Answers (1)

Luan Nico
Luan Nico

Reputation: 5927

gulp runs every task asynchronously by default, to improve performance. If you want to run in sequence, you need to explicit declare dependencies:

gulp.task('minifyBower', ['bower'], function() { /* ... */ });

Now minifyBower won't run until bower is run. If you need more complex stuff, you should use something like run-sequence.

Upvotes: 1

Related Questions