javascript - How to browserify an AngularJS project with multiple SPAs -

i'm trying implement browserify in existing angularjs project, in order create multiple spas share number of common modules.

the issue facing how extract list of template files can feed grunt-angular-templates.

i have created 'routes' file each app. app contains ui-router configuration of app's states. means path each template contained in value within file: 'templateurl: path_to_template_file'.

how can extract each of paths , feed them grunt-angular-templates?

thanks in advance.

each of spa "section", use gulpfile:

'use strict';  var gulp = require('gulp'); var gutil      = require('gulp-util'); var lr = require('tiny-lr'); var server = lr(); var browserify = require('gulp-browserify'); var spawn = require('child_process').spawn; var rename     = require('gulp-rename'); var plumber = require('gulp-plumber'); var refresh = require('gulp-livereload'); var uglify = require('gulp-uglify'); var templates = require('gulp-angular-templatecache'); var minifyhtml = require('gulp-minify-html'); var gulpif = require('gulp-if');  var sections = ['anonymous','admin','pro','ind']; sections.foreach(function(section){   gulp.task(section, function(cb) {      var isbuild = gutil.env.build;      //single entry point browserify     return gulp.src(['./client/' + section + '/' + section + '.js'])       .pipe(plumber(true))       .pipe(browserify({         insertglobals: true,         debug: true       }).on('error', function(){           gutil.log(gutil.colors.red('**************** error ****************'), arguments);           //cb();         }))       .pipe(gulpif(isbuild, uglify()))       .pipe(rename(section + '.js'))       .pipe(gulp.dest('./www/js'))       ;   }); });   gulp.task('lr-server', function() {   server.listen(35729, function(err) {     if (err) {       gutil.log(gutil.colors.red('error'), err);       return;     }   }); });   gulp.task('templates', function() {   var isbuild = gutil.env.build;    gulp.src(["www/partials/**/*.html"])     .pipe(minifyhtml({       quotes: true     }))     .pipe(templates('templates.js',{       module: 'app',       root: 'partials'     }))     .pipe(gulpif(isbuild, uglify()))     .pipe(gulp.dest('./www/js')) });   gulp.task('html', function() {   gulp.src(["www/*.html"])     .pipe(refresh(server)); });   gulp.task('nodemon', function(cb) {   spawn('./node_modules/.bin/nodemon', ['--watch', 'server', 'server/server.js', '--ext','js,coffee'], {     stdio: 'inherit'   })     .on('close', function() {       cb();     }); });  gulp.task('default', function() {    gutil.log(gutil.colors.green('default'), gutil.env);    gulp.run.apply(gulp, ['templates', 'lr-server', 'nodemon'].concat(sections));    gulp.watch('client/common/**/*.js', function(evt) {     gutil.log(gutil.colors.cyan('common'), 'changed');     gulp.run.apply(gulp, sections);   });    sections.foreach(function(section){     gulp.watch('client/' +       section +       '/**/*.js', function(evt) {       gutil.log(gutil.colors.cyan(section), 'changed');       gulp.run(section);     });   });    gulp.watch('www/css/**/*.css', function(evt) {     gutil.log(gutil.colors.cyan('css'), 'changed');     server.changed({       body: {         files: [evt.path]       }     });   });    gulp.watch('www/js/*.js', function(evt) {     gutil.log(gutil.colors.cyan('js'), 'changed', gutil.colors.gray(evt.path));     server.changed({       body: {         files: [evt.path]       }     });   });    gulp.watch('www/**/*.html', function(evt) {     gulp.run('templates');   });    gulp.watch('www/**/*.html', function(evt) {     gulp.run('html');   });  });  gulp.task('build', function() {    gutil.env.build = true;    gutil.log(gutil.colors.green('build'), gutil.env);    gulp.run.apply(gulp, ['templates'].concat(sections));  }); 

update:

@kpg

this directory structure (so far :) )

 root  ├── gulpfile.js  ├── package.json  ├─┬ client  │ ├─┬ admin  │ │ ├── index.js  │ │ ├─┬ controllers  │ │ │ └── admincontroller  │ │ ├─┬ services  │ │ │ └── someservice.js  │ │ └─┬ directives  │ │   └── somedirective.js  │ ├─┬ anonymous  │ │ ├── index.js  │ │ ├─┬ controllers  │ │ │ └── anonymouscontroller  │ │ ├─┬ services  │ │ │ └── someservice.js  │ │ └─┬ directives  │ │   └── somedirective.js  │ ├─┬ common  │ │ ├── config.js  │ │ ├── index.js  │ │ ├─┬ controllers  │ │ │ └── searchcontroller  │ │ ├─┬ filters  │ │ │ └── somefilter.js  │ │ ├─┬ services  │ │ │ └── someservice.js  │ │ └─┬ directives  │ │   └── somedirective.js  │ └─┬ foorole  │   ├── index.js  │   ├─┬ controllers  │   │ └── foorolecontroller  │   ├─┬ services  │   │ └── someservice.js  │   └─┬ directives  │     └── somedirective.js  ├─┬ server  │ ├── server.js  │ ├── api  │ ├── config  │ ├── admin  │ ├── controllers  │ ├── helpers  │ ├── models  │ ├── routes  │ └── service  └─┬ www    ├── css    ├── js    ├── partials    └── vendor