"systemjs-builder": How to build all dependencies in js file to one bundle.js file

Question

I use systemjs-builder with angular2.
I want builder bundle files by each module file.
Ex: I have the structure as below

Main.ts

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule }              from './AppModule';

AppModule.ts

import {NgModule, CUSTOM_ELEMENTS_SCHEMA, ErrorHandler} from "@angular/core";
import {CommonModule, LocationStrategy, HashLocationStrategy} from "@angular/common";
import {appRoutingProviders, routing} from "./Routes";
import {LoginComponent} from "./components/user/LoginComponent";
import {ErrorComponent} from "./components/common/errorPage/ErrorComponent";

Routes.ts 

{path: "accounts",loadChildren: 'app/components/account/AccountModule#AccountModule'},
{path: "contacts",loadChildren: 'app/components/contact/ContactModule#ContactModule'}

Now I used builder.bundle('[app/**/*]',bundle.js) to build all component to one file, so the size is very large.
I want to build all dependencies in Main.ts (AppModule.ts, all component in AppModule....) extra libraries (angular2/core...) to 'bundle.js'.
And all dependencies of AccountModule to AccountModule.js, all dependencies of ContactModule to ContactModule.js.
To use lazy load on production.
Any solution for this issue, thanks

Answer 1

If you generate a single bundle... Only can load it. You have to create differents bundles.

For example, a bundle for angular and rxjs, other for the main ng-module and other for each lazy ng-module.

I have been testing it the last days, take a look to this branch:

https://github.com/tolemac/systemjs-test/tree/bundle-format-system?files=1

It's a sample of a little angular app, using bundles for vendor, app and a lazy module.

Clone the repo, checkout "bundle-format-system" branch, "npm install" and "gulp bundle"