컴파일러나 런타임 관점에서는 유효하지만 복잡한 세부 사항이나 주의점이 있는 코딩 패턴이 많습니다. 이러한 패턴은 개발자가 의도한 효과를 내지 않아 버그로 이어지는 경우가 많습니다. Angular 컴파일러는 여러 패턴을 식별하는 "확장 진단"을 제공하여 개발자에게 잠재적인 문제를 알리고 코드베이스에 일반적인 모범 사례를 적용하도록 돕습니다.
진단 목록
현재 Angular는 다음 확장 진단을 지원합니다.
| 코드 | 이름 |
|---|---|
NG8101 |
invalidBananaInBox |
NG8102 |
nullishCoalescingNotNullable |
NG8103 |
missingControlFlowDirective |
NG8104 |
textAttributeNotBinding |
NG8105 |
missingNgForOfLet |
NG8106 |
suffixNotSupported |
NG8107 |
optionalChainNotNullable |
NG8108 |
skipHydrationNotStatic |
NG8109 |
interpolatedSignalNotInvoked |
NG8111 |
uninvokedFunctionInEventBinding |
NG8112 |
unusedLetDeclaration |
NG8113 |
unusedStandaloneImports |
NG8114 |
unparenthesizedNullishCoalescing |
NG8115 |
uninvokedTrackFunction |
NG8116 |
missingStructuralDirective |
NG8117 |
uninvokedFunctionInTextInterpolation |
NG8021 |
deferTriggerMisconfiguration |
설정
확장 진단은 기본적으로 경고이며 컴파일을 막지 않습니다. 각 진단을 다음 중 하나로 설정할 수 있습니다.
| 오류 범주 | 효과 |
|---|---|
warning |
기본값입니다. 컴파일러가 진단을 경고로 표시하지만 컴파일을 막지 않습니다. 경고가 있어도 컴파일러는 상태 코드 0으로 종료됩니다. |
error |
컴파일러가 진단을 오류로 표시하고 컴파일에 실패합니다. 하나 이상의 오류가 발생하면 컴파일러는 0이 아닌 상태 코드로 종료됩니다. |
suppress |
컴파일러가 해당 진단을 전혀 표시하지 않습니다. |
검사의 심각도는 Angular 컴파일러 옵션으로 설정할 수 있습니다.
{
"angularCompilerOptions": {
"extendedDiagnostics": {
"checks": {
"invalidBananaInBox": "suppress"
},
"defaultCategory": "error"
}
}
}
checks 필드는 각 진단의 이름을 해당 범주에 연결합니다.
확장 진단의 전체 목록과 설정에 사용할 이름은 진단 목록을 참고하세요.
defaultCategory 필드는 checks에 명시하지 않은 진단에 적용됩니다.
설정하지 않으면 이러한 진단은 warning으로 처리됩니다.
strictTemplates를 활성화하면 확장 진단이 발생합니다.
컴파일러가 Angular 템플릿 타입을 더 잘 이해하고 정확하고 의미 있는 진단을 제공하려면 이 설정이 필요합니다.
시맨틱 버전 관리
Angular 팀은 Angular의 마이너 버전에서 새로운 확장 진단을 추가하거나 활성화할 예정입니다(시맨틱 버전 관리 참고). 따라서 Angular를 업그레이드하면 기존 코드베이스에서 새로운 경고가 나타날 수 있습니다. 이를 통해 팀은 기능을 더 빠르게 제공하고 개발자가 확장 진단을 더 쉽게 활용하도록 할 수 있습니다.
하지만 "defaultCategory": "error"를 설정하면 이러한 경고가 컴파일을 실패시키는 오류로 바뀝니다.
따라서 마이너 버전 업그레이드로 컴파일 오류가 발생할 수 있으며, 이는 시맨틱 버전 관리 규칙에 어긋나는 호환성이 깨지는 변경으로 보일 수 있습니다.
새 진단은 위의 설정으로 숨기거나 경고로 낮출 수 있으므로 확장 진단을 기본적으로 오류로 처리하는 프로젝트에도 영향이 크지 않아야 합니다.
기본값을 오류로 설정하는 것은 매우 강력한 도구입니다. 프로젝트의 기본값으로 error가 적합한지 결정할 때 이러한 시맨틱 버전 관리상의 주의점을 고려하세요.
새로운 진단
Angular 팀은 추가할 수 있는 새로운 진단에 대한 제안을 언제나 환영합니다. 확장 진단은 일반적으로 다음 조건을 만족해야 합니다.
- Angular 템플릿에서 흔하지만 알아차리기 어려운 개발자의 실수를 감지합니다.
- 해당 패턴이 버그나 의도하지 않은 동작으로 이어지는 이유를 명확하게 설명합니다.
- 하나 이상의 명확한 해결책을 제안합니다.
- 오탐률이 낮아야 하며, 가능하면 없어야 합니다.
- 비공식 라이브러리에 한정되지 않고 대부분의 Angular 애플리케이션에 적용됩니다.
- 프로그램의 정확성이나 성능을 개선합니다. 코드 스타일은 린터의 역할입니다.
이러한 기준에 맞는 확장 진단에 대한 아이디어가 있다면 기능 요청을 등록해 보세요.