내 질문에는 두 가지 측면이 있습니다. 해결할 오류는 사용자 지정 경로 재사용 전략을 사용할 때 앵글 라우터 클래스 RouteReuseStrategy를 재정의하기 위해 구현 도구를 사용할 때 전략이 트리거되지 않고 아래와 같은 예외가 발생합니다.각도 프레임 워크 클래스를 확장 할 때의 오류 RouteReuseStrategy
UMSClient : 32 오류 : 형식 오류 : 개체 프로토 타입은 될 수있는 객체 또는 null : __extends의 평가에서 (http://localhost:8000/app/UMSClient/com/ipc/ums/modules/shared/CustomRouteReuse.service.js:8:13) (http://localhost:8000/app/UMSClient/com/ipc/ums/modules/shared/CustomRouteReuse.service.js:35:17) 에서 setPrototypeOf() 에서 을 정의되지 않은 (http://localhost:8000/app/UMSClient/com/ipc/ums/modules/shared/CustomRouteReuse.service.js:54:14) 로드 오류 http://localhost:8000/app/main.js
import { RouteReuseStrategy,ActivatedRouteSnapshot,DetachedRouteHandler}
from '@angular/router';
export class CustomRouteReuseStrategy extends RouteReuseStrategy {
shouldDetach(route: ActivatedRouteSnapshot): boolean { return false; }
store(route: ActivatedRouteSnapshot, detachedTree: DetachedRouteHandle): void {}
shouldAttach(route: ActivatedRouteSnapshot): boolean { return false; }
retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle { return null ; }
shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean {
console.log("inside shouldReuseRoute...");
return future.routeConfig === curr.routeConfig ;
}
}
나는 이것이 내 편집 및 전략과 관련이 있다고 생각합니다. 나는 gulp와 system j에서 나 전에 개발 된 프레임 워크를 사용한다. 앱을 각도 기반 cli 기반 웹팩에 복사 할 때 문제가 발생하지 않으며 경로 전략이 올바르게 실행됩니다. 내 빌드 설정의
세부 사항 :
("컴파일",() =>를 {
gulp.task를 컴파일 꿀꺽를 사용하여 할 tsResult = gulp.src ("응용 프로그램/* */*. ts ") .pipe (sourcemaps.init()) . 파이프 (tsc (tsProject)); return tsResult.js .pipe (sourcemaps.write (". ", {sourceRoot : '/ app '})) .pipe (gulp.dest ("build/app")); });
패키지 JSON이며,
"종속": { "각도/일반 @": "~ 4.3.1", "각도/컴파일러 @"
: "~ 4.3.1 " "각도/핵심 @ : ":"각/형태 @ ~ 4.3.1 "" ""~ 4.3.1/HTTP 각도 @ ",
" "" ~ 4.3.1 ", 012 "각도/플랫폼 브라우저 @"3,516,: "~ 4.3.1"
"각도/플랫폼 브라우저 동적 @"
: "~ 4.3.1", 각도 @"
/라우터 ":"~ 4.3.1 ""각 @/업그레이드 ":"~ 4.3.1 "
"@ angular2 소재/탭 ":"^ 2.0.0-alpha.8- 2 ",
"@ ng-bootstrap/ng-bootstrap ":"^ 1.0.0-alpha.9 ",
는 "angular2 - 메모리 - 웹 API": "0.0.20"
"부트 스트랩": "^ 3.3.6"
"코어 JS": "^ 2.4.1 "
"NG2 부트 스트랩 ":"^ 1.1.16-11 "
"NG2-BS3 모달 ":" "
"^ 0.10.4-NG2 datetime- 피커 ":"^ 0.9.8 "
"NGX 부트 스트랩 "" ""- 메타 데이터를 반영^2.0.0-beta.8 "
"^ 0.1.3 "
"rxjs": "^ 5.2.0",
,210"systemjs": "^ 0.20.19"
"TSD": "^ 0.6.5"
"밑줄": "^ 1.8.3"
"존. JS ":"^ 0.8.5 "
}
"devDependencies을 "{
"동시에 ":"^ 3.5.1 "
"델": "^ 3.0.0"
"단숨에": "^ 3.9.1"
"- sourcemaps을 꿀꺽": "^ 2.6.1""단숨에 -tslint ""^ 8.1.2 "
"꿀꺽 - 타이프 라이터를 "" ""^ 3.2.3 "
"라이트 서버^2.2.2 "
" tslint ":"~ 5.8.0 ",
"타이프": "~ 2.6.1"
"typings"
: "^ 2.1.1""의 TS-노드": "~ 3.3.0"
tsconfig.json :
{
"compilerOptions": {
"outDir": "build/app",
"target": "es5",
"module": "system",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false
},
"exclude": [
"gulpfile.ts",
"node_modules"
] }
내 특정 질문은,이 관련 런타임 의존성이 런타임 예외를 일으키는 지 알지 못합니다. 꿀꺽 꿀꺽 마시는 절차에 대한 지식이있는 분이라면 문제를 해결할 수 있도록 안내해주십시오.
이 예외에 대한 해결책으로 스택 오버플로를 탐색했습니다. 모든 토론은 클래스 계층의 순서로 몇 가지 문제가 있음을 나타내고 제 경우에는 100 %가 webpack angular cli 프로젝트에서 잘 작동하는 각도 프레임 워크 클래스를 사용하고 있습니다.
감사합니다.