프론트엔드/앵귤러
어헤드 오브 타임 컴파일러 작동원리
Jin-Co
2022. 12. 21. 13:41
반응형
변환단계
코드분석 (code analysis) | 코드생성 (code generation) | 템플릿 체크 (template type checking) |
소스코드 표본 생성하지만 변환은 하지 않는 단계. 메타데이터 문법 오류만 기록 | 메타데이터 오류 분석을 계속 실시하고 오류 표시 | 옵션 단계로 템플릿 내에 binding 문법 확인 |
템플릿 체크 옵션 켜기 tsconfig.json 파일에서
"strictInjectionParameters": true
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
// ...
},
"angularCompilerOptions": {
"enableI18nLegacyMessageIdFormat": false,
"strictInjectionParameters": true, // 옵션켜기
// ...
}
}
소스코드: https://angular.io/guide/angular-compiler-options
작동원리
코드분석
먼저, 코드분석 단계에서 TypeScript compiler가 코드 분석 후 .d.ts라는 타입정보를 생성합니다(이정보를 바탕으로 AOT compiler가 애플리케이션 코드를 생성). AOT compiler는 이 단계에서 decorator안에 기록된 메타데이터를 분석하고 .metadata.json파일을 .d.ts마다 생성합니다.
코드생성
코드생성 단계에서는 compiler가 메타데이터 문법 오류체크를 실시합니다. collector는 오류검사를 통과한 function이나 static method가 하나의 리턴 밸류를 가질 때 이를 수용합니다.
참고
Angular
angular.io
728x90
반응형