How to compile JS in sub directories using Gulp?

Question

My folder structure:

dashboard >
    components >
        accounts > accounts.js, accountsDirectives.js
        dash > dashApp.js
        settings > settings.js, settingsDirectives.js
        etc...

My function in the Gulpfile

function compile_js(minify, folder) {
    var jsLibs = gulp.src('client/'+folder+'/_sources/js/libs/*.js');
    var jsPlugins = gulp.src('client/'+folder+'/_sources/js/plugins/*.js');
    var jsCustom = gulp.src('client/'+folder+'/_sources/js/custom/*.js');
    var jsComponents = gulp.src('client/'+folder+'/components/*.js');

    // Order the streams and compile
    return streamqueue({ objectMode: true },
        jsLibs,
        jsPlugins,
        jsCustom,
        jsComponents
    )
    .pipe(concat(folder+'.module.js'))
    .pipe(gulpif(minify, uglify()))
    .pipe(gulp.dest('client/'+folder+'/assets/js'));
};

The issue is this line, that targets the components directory:

var jsComponents = gulp.src('client/'+folder+'/components/*.js');

I've also tried /components/**/*.js but still doesn't work.

I found this answer here, which they talk about symlinks, but I want to avoid using that. 1) It seems like a hack, and 2) this requires all current and future devs to create the exact symlinks on their computers as well.

Is there another way to easily target and compile all js files in a directory with sub directories?

score 1 · Accepted Answer · answered Feb 23 '15 at 06:07

1

Have you tried creating the paths first and then using the variables in your gulp.src arguments? Im also curious if since you are minifying them, why don't you just grab all the files for some of them with something like :

var someVar = gulp.src('client/'+folder+'/_sources/js/**/*.js');

vs

var jsPlugins = gulp.src('client/'+folder+'/_sources/js/plugins/*.js');
var jsCustom = gulp.src('client/'+folder+'/_sources/js/custom/*.js');

answered Feb 23 '15 at 06:07

DvideBy0

678
2
12
27

Well I had to break the sources up because I needed plugins to get compiled before custom, otherwise my custom particle.js file breaks. Interesting though, the `/**/*.js` seem to work for my `js` folder, wonder why not for my `components` folder – Leon Gaban Feb 23 '15 at 06:15
Have you tried `var jsComponents = gulp.src('client/'+folder+'/**/*.js');` – DvideBy0 Feb 23 '15 at 06:16
1

looking at your folder structure above looks like it would be `var jsComponents = gulp.src('dashboard/components/**/*.js');` – DvideBy0 Feb 23 '15 at 06:18
Yeah now it's working... `/**/` is grabbing all the sub directories, thank you stackoverflow magic lol, now on to the next error ;) – Leon Gaban Feb 23 '15 at 06:21

How to compile JS in sub directories using Gulp?

1 Answers1