CustomReuseStrategy 올바른 구성 요소 이름을 인쇄하지

Question

내가 설명한대로 개념을 사용하고 CustomReuseStrategy을 이용하고 있고 shouldReuseRoute을 구현하기 위해

https://medium.com/@juliapassynkova/angular-2-component-reuse-strategy-9f3ddfab23f5을 언급했다 :

shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean { 
    let name = future.component && (<any>future.component).name; 
    return super.shouldReuseRoute(future, curr) && name !== 'DetailSameComponent'; 
    } 

이를 개발 환경에서 잘 작동하지만 프로덕션 환경에서는 구성 요소 이름이 올바르게 인쇄되지 않습니다. 프로덕션 환경이란 말은 webpack을 사용하여 클라이언트를 빌드하고 빌드를 서버에 복사하여 실행하는 경우입니다. 이 경우 모든 구성 요소 이름은 't'문자로 인쇄됩니다.

왜 't'로 인쇄됩니까? 일부 webpack 압축을 수행하고 있습니까? webpack을 사용할 때 올바른 구성 요소 이름을 얻으려면 어떻게해야합니까? webpack을 사용하여 올바른 구성 요소 이름을 얻을 수있는 방법이 없으면 구성 요소에 따라 resueRoute 여부를 결정할 수 있도록이 조건을 어떻게 수정할 수 있습니까?

Answer 1

이 가이드에 이어 잠시 멈춰서지만 내 문제를 해결 한 것 같습니다. "t"만 인쇄하는 이유는 앵귤러가 자바 스크립트를 축소하여 네트워크를 통해 출하 할 때 번들 크기를 크게 줄이기 때문입니다. 문제는 클래스 이름도 변경하는 것처럼 보이므로 클래스 이름에 텍스트로 의존하는 것은 더 이상 작동하지 않습니다. 해결책은 이것입니다. 대신에 텍스트로 구성 명을 사용

shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean { 
    let name = future.component && (<any>future.component).name; 
    return super.shouldReuseRoute(future, curr) && name !== 'DetailSameComponent'; 
} 

를 사용

않고 ​​사용 컴포넌트 자체에 대한 참조를 사용

import DetailSameComponent from {...} 

shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean { 
    return super.shouldReuseRoute(future, curr) && future.component !== DetailSameComponent; 
} 

한다.

TLDR : 스왑 이름 = 'ComponentNameAsText'에 future.component = 구성 요소