애니메이션 유효성 검사 및 타입 생성

플레이어에서 문제가 발생하기 전에 확장 프로그램의 개발자 도구로 애니메이션 데이터 오류를 찾아보세요.

에디터 기능

인식된 Lottie JSON에서는 다음 기능을 사용할 수 있습니다.

• 스키마 유효성 검사

• IntelliSense와 자동 완성

• 호버 문서

• 관련 애니메이션 데이터로 이동

• 오류 강조 및 실시간 진단

진단 결과로 호환성과 데이터 품질을 먼저 확인하세요. 문법상 올바른 JSON이라도 대상 런타임에서 지원하지 않는 기능이 들어 있을 수 있습니다.

dotLottie 구조 확인

파일을 직접 압축 해제하지 않고 dotLottie Explorer에서 번들 매니페스트와 포함된 콘텐츠를 살펴볼 수 있습니다. 코드를 생성하기 전에 애니메이션 ID, 마커, 에셋, 테마, 상태 머신을 확인하세요.

TypeScript 식별자 생성

타입 생성을 지원하는 .lottie 파일에서 LottieFiles 명령을 실행합니다. 현재 생성기는 다음 타입을 만듭니다.

• 상태 머신 ID

• 마커 이름

애플리케이션 곳곳에서 문자열 리터럴을 반복하는 대신 생성된 값을 사용하세요. 애니메이션의 인터페이스가 바뀌면 타입을 다시 생성합니다.

현재 생성기는 세그먼트나 테마 타입을 만들지 않습니다.

CI 유효성 검사 추가

CI 설정 명령을 사용하면 다음과 같은 검사 파일을 만들 수 있습니다.

• GitHub Actions 워크플로

• pre-commit 훅

• .relottierc.json 설정

생성된 파일은 커밋하기 전에 모두 확인하세요. 현재 생성되는 .relottierc에는 설정 UI에 보이는 것보다 적은 규칙이 들어갈 수 있습니다. CI의 실제 동작은 생성된 파일을 기준으로 판단하세요.

권장 검사 순서

1. 로컬에서 애니메이션을 미리 봅니다.

2. JSON 또는 스키마 진단을 해결합니다.

3. dotLottie 매니페스트 기능을 확인합니다.

4. 대상 런타임 또는 호환성 검사를 실행합니다.

5. 타입을 다시 생성합니다.

6. CI에서 같은 검사를 실행합니다.

관련 문서

• 명령 및 설정

• 출력 형식 선택