Multiple node modules in a browser package

Question

I am working on a client-side project using various dependencies (e.g. page, super agent, vue). To optimize the speed of the task, I would like to create a package containing all these dependencies in one file, such as lib.js. My source will be compiled in app.js. And then, I think, I will have to contact both with my build.js. With this setting, grunt will only update app.js and build.js), not lib.js. This also means that for every dependency included in lib.js, I can still require (dep).

I read several articles about this, but I can't get it to work.

My current browser task is:

browserify: {
        dev: {
            files: {
                'build/app.js': ['src/**/*.js', 'src/**/*.html']
            },
            options: {
                debug: true,
                external: ['vue', 'superagent', 'page']
            }
        }
    }

and I tried to add something like this without success:

browserify: { // the dev target is still there
        lib: {
            files: {
                'build/lib.js': ['vue', 'superagent', 'page']
            }
        }
    }

, , , , .

. !

Answer 1

- , Bower ( npm).

-, libs ( TweenMax ):

libs: {
    files: {
        'build/public/libs.js': ['bower_components/greensock/src/minified/TweenMax.min.js']
    },
    options: {
        shim: {
            TweenMax: {
                path: 'bower_components/greensock/src/minified/TweenMax.min.js',
                exports: 'TweenMax'
            }
        }
    }
}

:

dev: {
    files: {
        'build/public/desktop/desktop.js': ['src/desktop/**/*.js']
    },
    options: {
        external: ['TweenMax']
    }
}

. , (, debowerify/deglobalify), .