2017-05-24 4 views
0

라우팅을 위해 angular-cli 및 lazyloader를 사용하고 있습니다.lazyloader가 AOT 생산 모드 angular-cli에서 작동하지 않습니다.

나를 위해 작동하지만 프로덕션 모드로 프로젝트를 빌드 한 후 전혀 작동하지 않습니다.

은 여기 내 app.routing.ts

import { NgModule } from '@angular/core'; 
import { Routes, RouterModule } from '@angular/router'; 
import { MainComponent } from './main/main.component'; 
import { AuthGuard } from './core/guards/index'; 
//Layouts 
import { LoginComponent } from './login/login.component'; 

export const routes: Routes = [ 
    { 
    path: 'login', 
    component: LoginComponent 
    }, 
    { 
    path: '', 
    component: MainComponent, 
    children: [ 
     { 
     path: '', 
     loadChildren: './main/main.module#MainModule' 
     } 
    ], 
    canActivate: [AuthGuard] 
    },{ 
    path: '**', 
    redirectTo: 'login' 
    } 
]; 

@NgModule({ 
    imports: [ RouterModule.forRoot(routes) ], 
    exports: [ RouterModule ] 
}) 
export class AppRoutingModule {} 

입니다 그리고 이것은 내가 ng build --prod --aot 또는 ng serve --prod 후있어 오류입니다.

ERROR Error: Uncaught (in promise): Error: Cannot find module './app/main/main.module'. 
Error: Cannot find module './app/main/main.module'. 
    at t (main.1f6da18….bundle.js:1) 
    at t.loadAndCompile (vendor.490f84a….bundle.js:379) 
    at t.load (vendor.490f84a….bundle.js:379) 
    at t.loadModuleFactory (vendor.490f84a….bundle.js:428) 
    at t.load (vendor.490f84a….bundle.js:428) 
    at e.project (vendor.490f84a….bundle.js:428) 
    at e.XO5T.e._tryNext (vendor.490f84a….bundle.js:897) 
    at e.XO5T.e._next (vendor.490f84a….bundle.js:897) 
    at e.next (vendor.490f84a….bundle.js:897) 
    at e.RRVv.e._subscribe (vendor.490f84a….bundle.js:736) 
    at t (main.1f6da18….bundle.js:1) 
    at t.loadAndCompile (vendor.490f84a….bundle.js:379) 
    at t.load (vendor.490f84a….bundle.js:379) 
    at t.loadModuleFactory (vendor.490f84a….bundle.js:428) 
    at t.load (vendor.490f84a….bundle.js:428) 
    at e.project (vendor.490f84a….bundle.js:428) 
    at e.XO5T.e._tryNext (vendor.490f84a….bundle.js:897) 
    at e.XO5T.e._next (vendor.490f84a….bundle.js:897) 
    at e.next (vendor.490f84a….bundle.js:897) 
    at e.RRVv.e._subscribe (vendor.490f84a….bundle.js:736) 
    at u (polyfills.1e19b2c….bundle.js:43) 
    at u (polyfills.1e19b2c….bundle.js:43) 
    at polyfills.1e19b2c….bundle.js:43 
    at t.invokeTask (polyfills.1e19b2c….bundle.js:36) 
    at Object.onInvokeTask (vendor.490f84a….bundle.js:365) 
    at t.invokeTask (polyfills.1e19b2c….bundle.js:36) 
    at r.runTask (polyfills.1e19b2c….bundle.js:36) 
    at o (polyfills.1e19b2c….bundle.js:36) 

다음은 브라우저 콘솔의 스크린 샷입니다.

enter image description here

내 라우팅 구성에 문제가 있습니까? PP : ng serve은 오류가없는 상태에서 작업 중입니다.

+1

ng 빌드를 실행하면 어떻게됩니까? --prod --aot false –

+0

답장을 보내 주셔서 감사합니다. 나는 그것을 시도하고 아파치 서버에서 테스트. 'Uncaught TypeError : undefined'의 'property'호출을 읽을 수 없습니다. 내 코드에 문제가있을 수 있습니까? – blackiii

+0

내 코드에 문제가있었습니다. 'loadChildren : './main/main.module.ts # MainModule'' 나는 이것을'loadChildren :'/ main/main.module # MainModule'으로 변경했습니다. 그리고'ng build --prod --aot false'가 잘 작동합니다. AoT의 문제점은 무엇입니까? – blackiii

답변

2

이 문제는 angular2-busy 모듈에서 발생합니다.

https://www.npmjs.com/package/angular2-busy

프로젝트 해결 문제에서이 제거.

+0

감사합니다! 무수한 시간 동안 각과 각 각 cli의 다른 버전으로 어지럽히고 난 후에, 이것은 범인으로 밝혀졌다. 실제 문제는 개발하는 동안 또는 프로덕션을 위해 빌드 할 때이 문제를 알 수 없다는 것입니다. 아니요,이 오류는 응용 프로그램을 사용하려고 할 때 배포 한 후 팝업됩니다. 그리고 나서 당신은 원인이 무엇인지 명확한 오류조차받지 못합니다. 단순히 놀라움. –