lottie-marketplace은(는) 무엇을 하나요?
두 가지 Claude Code 명령어를 사용하여 Lottie 애니메이션을 검색, 가져오고 React, Vue, Flutter 및 기타 프레임워크에 통합할 수 있습니다.
명령어
/search-lottie
설명: LottieFiles 마켓플레이스에서 애니메이션을 검색합니다.
인수:
<query>(필수): 검색할 키워드 또는 구문.
/get-lottie
설명: 애니메이션 ID를 기준으로 특정 Lottie 애니메이션의 상세 정보를 가져오고 통합 코드를 생성합니다.
인수:
<animationId>(필수): LottieFiles에서 애니메이션 ID.
사용 예시
애니메이션 검색
/search-lottie loading spinner
상세 정보 및 통합 코드 얻기
/get-lottie abc123
통합 예시 (React)
import Lottie from "lottie-react";
import animationData from "./animation.json";
const App = () => <Lottie animationData={animationData} loop />;
통합 예시 (Vue)
<template>
<VueLottie :animationData="animationData" :loop="true" />
</template>
<script>
import animationData from "./animation.json";
</script>
통합 예시 (Flutter)
import 'package:lottie/lottie.dart';
Lottie.asset('animation.json')
지원되는 프레임워크
| 프레임워크 | 라이브러리 |
|---|---|
| React | lottie-react |
| Vue | vue-lottie |
| Flutter | lottie |
추가 정보
- 애니메이션 ID는 LottieFiles 웹사이트의 애니메이션 세부 정보 페이지 URL에서 찾을 수 있습니다.
- 항상 저작권 및 라이선스 조건을 확인하세요.