GSAP

Вы можете легко добавить GSAP в свой проект Astro!

1. Начните с установки пакета gsap с помощью вашего любимого менеджера пакетов:

   npm

   npm install gsap

   pnpm

   pnpm add gsap

   yarn

   yarn add gsap

2. Теперь вы можете импортировать его в свой проект внутри scriptа в любом файле .astro:

   src/components/Foo.astro

   <script>
     import { gsap } from 'gsap'
   
     const box = document.getElementById('box')
     const myTimeline = gsap.timeline()
   
     myTimeline
       .from(box, {
         opacity: 0,
       })
       .to(box, {
         opacity: 1,
         duration: 0.25,
       })
   </script>
   
   <div id="box"></div>

3. Вот и все, вы готовы к использованию GSAP в своем проекте!

Чтобы узнать больше о GSAP, посетите их официальный сайт или их документацию:

GSAP Documentation