
Опропит свои веб -анимации с официальными игроками Lottiefiles для Dotlottie и Lottie Animation. Предназначенные для быстрой интеграции, эти пакеты помогают разработчикам быстро вводить анимированные визуальные эффекты в веб -проекты с минимальными усилиями.




Dotlottie-это формат файла с открытым исходным кодом, который объединяет один или несколько файлов Lottie и связанные с ним ресурсы в один файл. Они представляют собой архивы ZIP, сжатые с помощью метода сжатия дефрового сжатия и переносят расширение файла «.lottie».
Узнайте больше о Dotlottie.
Monorepo содержит следующий пакет:
| Упаковка | Описание |
|---|---|
| @lottiefiles/dotlottie-web | Библиотека JavaScript для отмены анимации Lottie и Dotlottie в браузере или Node.js. |
| @lottiefiles/dotlottie-react | Обертка для компонента React для dotlottie-web , которая обеспечивает декларативный API для отображения анимации Lottie и Dotlottie и управления пользовательским интерфейсом для взаимодействия с ними. |
| @lottiefiles/dotlottie-wc | Обертка для веб-компонентов для dotlottie-web , которая предоставляет декларативный API для отмены анимации Lottie и Dotlottie и управления пользовательским интерфейсом для взаимодействия с ними. |
| @lottiefiles/dotlottie-vue | Обертка для компонента Vue для dotlottie-web , которая предоставляет декларативный API для отмены анимации Lottie и Dotlottie и управления пользовательским интерфейсом для взаимодействия с ними. |
| @lottiefiles/dotlottie-svelte | Странная компонентная обертка для dotlottie-web , которая обеспечивает декларативный API для отмены анимации Lottie и Dotlottie и управления пользовательским интерфейсом для взаимодействия с ними. |
Примечание. Каждый пакет имеет свою собственную readme.md с подробной документацией об использовании и API.
Чтобы внести свой вклад в этот монорепо или использовать его пакеты в вашем проекте, выполните эти шаги настройки:
Убедитесь, что у вас установлено следующее:
pnpm версия 8 Клонировать Monorepo:
git clone https://github.com/LottieFiles/dotlottie-web.git
cd dotlottie-webУстановить зависимости:
pnpm install @lottiefiles/dotlottie-web
@lottiefiles/dotlottie-react
@lottiefiles/dotlottie-vue
Узнайте, как реализовать и использовать пакеты Dotlottie-Web с нашими примерами приложений. Эти примеры служат практическим руководством, которое поможет вам понять, как интегрировать анимацию Lottie и Dotlottie в ваши веб -проекты.
Доступные примеры:
@lottiefiles/dotlottie-web чтобы отобразить анимацию Lottie или Dotlottie в браузере.@lottiefiles/dotlottie-web в среде node.js. Он демонстрирует управление воспроизведением анимации, рендеринг кадров за кадром и преобразование анимации Dotlottie в файл GIF. Для получения дополнительной информации см. 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 devНе стесняйтесь модифицировать и играть с кодом, чтобы увидеть, как изменения влияют на анимации.
Чтобы построить все пакеты в монорепо:
pnpm run buildЧтобы начать местную среду разработки для всех пакетов:
pnpm run devВот краткое объяснение сценариев, доступных в корневом пакете.
build : сборка всех пакетов с помощью Turbo.changelog : добавляет набор изменений для генерации изменений и обновлений версий.clean : очищает репозиторий, удаляя артефакты разработки.dev : запускает все пакеты в режиме разработки/часов.format : Форматирует кодовую базу с использованием более красивого и замечания.lint : Lints кодовая база с использованием Eslint.test : запускает тесты во всех пакетах.type-check : проверяет ошибки типа типа. Полный список доступных сценариев см. В разделе scripts в package.json .
Мы приветствуем взносы в любой из пакетов в этом монорепо. Пожалуйста, прочитайте наши рекомендации по внесению вкладчиков и наш кодекс поведения, чтобы узнать о нашем процессе разработки, как предложить ошибки и улучшения, а также о том, как создавать и проверить ваши изменения в проекте.
MIT © Lottiefiles