Dynamically loading multiple entry points and splitting output

Question

I have several different angular modules that I want to dynamically concatenate such that each module has a different single output file.

so that if in the resources/assets/js/angular/modules directory I have:

Role   
  - controllers
      roleIndexController   
  - app.js

Descriptions
   -controllers
      descriptionIndexController
   -app.js

And I want this to end up being two files:

RoleModule.js
DescriptionsModule.js

And I don't want to explicitly have to add each module to the gulp file every time I add a new one.

I've tried adding glob characters using webpack in laravel elixir:

require('laravel-elixir-webpack');

elixir(function (mix) {    
    mix.webpack(
        ['angular/app.js', '.angular/modules/**/app.js'],
        {
            output : {
                filename : './angular/app.js'
        }
})

and also just using gulp-webpack and glob_entries:

gulp.task('compileAngularScripts', function(){
    return gulp.src('angular/app.js')
        .pipe(webpack({
            entry :   glob_entries('./resources/assets/js/angular/modules/**/app.js'),
            output : {
                filename : 'app.js'
            }
        }))
        .pipe(gulp.dest('test/'));
});

I can't even seem to get the glob wildcard characters to work in order to dynamically concatenate files, much less break each module into it's own file.

Is there a way to do this using gulp?

Answer 1

I accomplished this by using the glob npm package with webpack

var glob                     = require('glob');
var webpack                  = require('gulp-webpack');

 elixir(function (mix) {
    .task('compileScripts')


gulp.task('compileScripts', function () {

return gulp.src('angular/app.js')
    .pipe(webpack({
        entry  : entries(),
        output : {
            filename : "[name]Module.js"
        }
    }))
    .pipe(gulp.dest('public/js/angular/modules'));
});

function entries() {
    var entries = {};
    glob.sync('./modules/**/Resources/assets/angular/app.js').forEach(function (url) {
        var moduleNmae      = url.split("/")[2];
        entries[moduleNmae] = url;
    });

    return entries;
}