
Rationalisez vos animations Web avec les joueurs officiels de Lottigies pour les animations de Dotlottie et Lottie. Conçus pour une intégration rapide, ces packages aident les développeurs à apporter rapidement des visuels animés dans des projets Web avec un minimum d'effort.




DotLottie est un format de fichiers open source qui regroupe un ou plusieurs fichiers Lottie et leurs ressources associées en un seul fichier. Ce sont des archives zip compressées avec la méthode de compression dégonflée et transportent l'extension de fichier de ".Lottie".
Apprenez-en plus sur DotLottie.
Le monorepo contient le package suivant:
| Emballer | Description |
|---|---|
| @ Lottiefiles / DotLottie-Web | Une bibliothèque JavaScript pour rendre les animations Lottie et DotLottie dans le navigateur ou node.js. |
| @ Lottiefiles / DotLottie-React | Un emballage de composant React pour dotlottie-web qui fournit une API déclarative pour rendre les animations Lottie et Dotlottie et les commandes d'interface utilisateur pour interagir avec eux. |
| @ Lottiefiles / dotLottie-wc | Un emballage de composants Web pour dotlottie-web qui fournit une API déclarative pour rendre les animations Lottie et Dotlottie et les commandes d'interface utilisateur pour interagir avec eux. |
| @ Lottiefiles / DotLottie-Vue | Un emballage de composant Vue pour dotlottie-web qui fournit une API déclarative pour rendre les animations Lottie et Dotlottie et les commandes d'interface utilisateur pour interagir avec eux. |
| @ Lottiefiles / DotLottie-Svelte | Un emballage de composant Svelte pour dotlottie-web qui fournit une API déclarative pour rendre les animations Lottie et Dotlottie et les contrôles d'interface utilisateur pour interagir avec eux. |
Remarque: Chaque package a son propre Readme.md avec une documentation détaillée sur l'utilisation et les API.
Pour contribuer à ce monorepo ou utiliser ses packages dans votre projet, suivez ces étapes de configuration:
Assurez-vous que vous avez installé les suivants:
pnpm version 8 Clone le monorepo:
git clone https://github.com/LottieFiles/dotlottie-web.git
cd dotlottie-webInstallez les dépendances:
pnpm install @lottiefiles/dotlottie-web
@lottiefiles/dotlottie-react
@lottiefiles/dotlottie-vue
Découvrez comment implémenter et utiliser les packages DotLottie-Web avec nos applications d'exemples. Ces exemples servent de guide pratique pour vous aider à comprendre comment intégrer les animations de Lottie et DotLottie dans vos projets Web.
Exemples disponibles:
@lottiefiles/dotlottie-web pour rendre une animation Lottie ou dotLottie dans le navigateur.@lottiefiles/dotlottie-web dans un environnement Node.js. Il présente le contrôle de la lecture de l'animation, rendant cadre par image et convertissant une animation dotLottie en fichier gif. Pour plus d'informations, consultez le Readme. git clone https://github.com/LottieFiles/dotlottie-web.git
cd dotlottie-webpnpm installpnpm run build # Change directory to the example app folder
cd apps/dotlottie-web-example
pnpm run devN'hésitez pas à modifier et à jouer avec le code pour voir comment les changements affectent les animations.
Pour construire tous les packages dans le monorepo:
pnpm run buildPour démarrer un environnement de développement local pour tous les packages:
pnpm run devVoici une brève explication des scripts disponibles dans le package racine.json:
build : construit tous les packages à l'aide de turbo.changelog : ajoute un ensemble de modifications pour générer des mises à jour ChangeLog et de version.clean : nettoie le référentiel en supprimant les artefacts de développement.dev : Exécute tous les packages en mode développement / montre.format : Formats la base de code en utilisant plus jolie et remarque.lint : peluches à la base de code à l'aide d'Eslint.test : exécute des tests sur tous les packages.type-check : vérifie les erreurs de type TypeScript. Pour une liste complète des scripts disponibles, consultez la section scripts dans package.json .
Nous saluons les contributions à l'un des packages de ce monorepo. Veuillez lire nos lignes directrices contributives et notre code de conduite pour en savoir plus sur notre processus de développement, comment proposer des fiducies et des améliorations, et comment créer et tester vos modifications au projet.
MIT © Lottiefiles