Temuk yüklü bileşenlerin üretim dis klasörünün içinde açısal kısayolda nasıl gruplanır?

Question

Geliştirme için angular-cli kullanıyorum ve projemi oluşturmak için aşağıdaki komutları ve kodu kullandım.

npm install angular-cli (açısal cli: 1.0.0-beta.10) Daha sonra, aşağıdaki komut ile bir dosya app.router.ts ilave ng g component lazy-me

ng new my-app

import { provideRouter, RouterConfig } from '@angular/router'; 
import { AppComponent } from './app.component'; 
// import { LazyMeComponent } from './+lazy-me/lazy-me.component'; 

const appRoutes : RouterConfig = [ 
    {path: '', component: AppComponent}, 
// {path: 'lazyme', component: LazyMeComponent} 
    {path: 'lazyme', component: 'app/+lazy-me#LazyMeComponent'} 
]; 

export const APP_ROUTER_PROVIDER = [ 
    provideRouter(appRoutes) 
]; 

ve değiştirilebilir aşağıdaki gibi benim main.ts

import { bootstrap } from '@angular/platform-browser-dynamic'; 
import { enableProdMode, 
    SystemJsComponentResolver, 
    ComponentResolver } from '@angular/core'; 
import {RuntimeCompiler} from '@angular/compiler'; 
import { AppComponent, environment } from './app/'; 

import { APP_ROUTER_PROVIDER } from './app/app.router'; 

if (environment.production) { 
    enableProdMode(); 
} 

bootstrap(AppComponent,[ 
    APP_ROUTER_PROVIDER, 
    { 
    provide: ComponentResolver, 
    useFactory: (r) => new SystemJsComponentResolver(r), 
    deps: [RuntimeCompiler] 
    }, 
]); 

Ve aşağıdaki komutu ng build -prod

Bir web sunucusu için kodumu dağıtmak ve lazyme yolu gidin kullandık üretim yapı yapmak, ben 404 hata app/lazy-me/lazy-me.component.js

için klasörün var olsun ancak lazy-me.component.js, her şey beklendiği gibi eksik. 0s ve .html dosyaları hariç main.js. Bununla birlikte, dist/app/lazy-me/ numaralı telefona lazy-me.component.js'u dahil etmek için ng build -prod numaralı telefonu istiyorum.

-prod yapılamıyorken klasörünün parçası olmak için system-config.ts veya başka bir yerde yüklü yüklü bileşenleri ekleyebileceğim herhangi bir ayar var mı?

Answer 1

'Tembel' bileşeninizin aslında yönlendirici yapılandırmanızda tembel yüklü olmadığı görülüyor. İlk olarak, tembel olarak yüklemek istediğiniz kendi modülünde sarmanız gerekir. Ardından, doğrudan bileşene atıfta bulunmak yerine, bu modüle başvurmak için yönlendirici yapılandırmanızda 'loadChildren' özelliğine ihtiyacınız vardır. Ayrıca https://vsavkin.com/angular-router-declarative-lazy-loading-7071d1f203ee

böyle ayıklama sorunları: Eğer Açısal CLI sürümünü yükseltmek için istekli olup olmadığını

Bu makale bayat gidip yardım değil umut tam yayında üzerine biraz daha ışık tutabilir En azından beta.32'ye kadar, oluşturucu-tepki-uygulamasına benzer bir 'çıkarma' komutu eklediler. Bunu kullanarak, webpack yapılandırma dosyasına erişirsiniz. Bunu kullanarak, varsayılan CLI beklendiği gibi çalışmıyorsa, üretim yapısını ihtiyaçlarınıza uyacak şekilde değiştirebilirsiniz. Bunun bir tür çalışma olduğunu biliyorum. İyi şanslar!