2016-09-15 8 views
0

Ich bündle meine Lazy geladenen Module in eckigen 2 RC6 mit Systemjs Builder, wenn ich meine App laufen sehe ich alle nicht faul geladene Module heruntergeladen (mit Fiddler) und das ist Weil ich sie in app.module.ts importiere, aber keines meiner Lazy Lademodule mit der "loadChildren" -Eigenschaft in app.routing funktioniert, sehe ich einen weißen Bildschirm mit "loading ...", der dort für immer hängt und das Modul nicht ist heruntergeladen. das ist mein app.routing:Lazy Laden mit Systemjs Builder gebündelte Projekte - Angular 2 RC6

export const routes: Routes = [ 
     { path: '', redirectTo: '/strategies', pathMatch: 'full' }, 
**// NONE OF THE BUNDLES FOR FOLLOWING MODULES ARE BEING DOWNLOADED BY SYSTEM** JS 
     { path: 'strategies', loadChildren: 'app/strategy/strategy.module' }, 
     { path: 'login', loadChildren: 'app/login/login.module' }, 
     { path: 'crises', loadChildren: 'app/crisis/crisis.module' }, 
     { path: 'heroes', loadChildren: 'app/hero/hero.module' }, 
    ]; 
    export const routing = RouterModule.forRoot(routes); 

dies mein app.module ist:

@NgModule({ 
    declarations: [ 
     AppComponent, 
    ], 
    imports: [ 
     BrowserModule, 
     routing, 
     CoreModule, ==> **THIS IS BUNDLED TOO AND SYSTEMJS DOWNLOADS IT UP FRONT** 
     HttpModule, 
    ], 
    bootstrap: [AppComponent], 
    providers: [ 
     { provide: LocationStrategy, useClass: HashLocationStrategy }, 
    ], 
}) 
export class AppModule { } 

das ist mein Bündel config in systemjs.config Datei:

bundles: { 
    'dist/index.js': ['app/*'], 
    'dist/shared/index.js': ['app/shared/*'], 
    'dist/core/index.js': ['app/core/*'], 
    'dist/crisis/index.js': ['app/crisis/*'], 
    'dist/hero/index.js': ['app/hero/*'], 
    'dist/strategy/index.js': ['app/strategy/*'], 
    'dist/login/index.js': ['app/login/*'], 

    'dist/dependencies.js' : [ 
     '@angular/core/bundles/core.umd.js', 
     '@angular/common/bundles/common.umd.js', 
     '@angular/compiler/bundles/compiler.umd.js', 
     '@angular/platform-browser/bundles/platform-browser.umd.js', 
     '@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js', 
     '@angular/http/bundles/http.umd.js', 
     '@angular/router/bundles/router.umd.js', 
     '@angular/forms/bundles/forms.umd.js', 
     'angular2-in-memory-web-api/index.js', 
     'rxjs/*','rxjs/scheduler/*','rxjs/add/*','rxjs/add/operator/*','rxjs/observale/*','rxjs/add/observable/*', 
     ] 
} 

Jeder Hinweis würde geschätzt werden.

Antwort

2

nur für den Fall, dass dies hilft, konnte ich mein Problem lösen. Die Konfiguration war falsch. Ich habe meine Systemjs-Konfigurationsdatei aktualisiert, um zwei verschiedene Konfigurationen zu haben, eine für die Entwicklung und eine für die Systemjs-Builder-Bundles. die Produktion/Bündel Version ist wie folgt:

config.transpiler = 'typescript', 
    config.map = { 
     'app': 'app', // this is where your transpiled files live 
     '@angular': 'node_modules/@angular', 
     'rxjs': 'node_modules/rxjs', 
     'typescript': 'node_modules/typescript/lib/typescript.js' 
    }; 
    config.packages = { 
     'app': { main: 'main.js', format: 'cjs', defaultExtension: 'js' }, 

     '@angular/core': { main: 'index.js' }, 
     '@angular/common': { main: 'index.js' }, 
     '@angular/compiler': { main: 'index.js' }, 
     '@angular/forms': { main: 'index.js' }, 
     '@angular/http': { main: 'index.js' }, 
     '@angular/platform-browser': { main: 'index.js' }, 
     '@angular/platform-browser-dynamic': { main: 'index.js' }, 
     '@angular/router': { main: 'index.js' }, 
     'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }, 
     'rxjs': { defaultExtension: 'js' }, 
    }; 
    config.bundles = { 
     'dist/index.js': ['app/*'], 

     'dist/dependencies.js': [ 
     '@angular/core/index.js', 
     '@angular/common/index.js', 
     '@angular/compiler/index.js', 
     '@angular/platform-browser/index.js', 
     '@angular/platform-browser-dynamic/index.js', 
     '@angular/http/index.js', 
     '@angular/router/index.js', 
     '@angular/forms/index.js', 
     'angular2-in-memory-web-api/index.js', 
     'rxjs/*', 'rxjs/scheduler/*', 'rxjs/add/*', 'rxjs/add/operator/*', 'rxjs/observale/*', 'rxjs/add/observable/*', 
     ] 
    } 

und die Entwicklung Config bleibt gleich. mehr Infos: rc6 config

+0

Können Sie mir dabei helfen? http://stackoverflow.com/questions/40422760/angular2-lazy-loading-modules-how-to-create-a-build-package-with-systemjs-build – smartmouse

+0

beantwortet: [hier] (http: // stackoverflow. com/a/40479553/2071008) –

Verwandte Themen