Я использовал пряжу, чтобы добавить эти библиотеки gsap, но файлы выглядят отключенными? Что это значит?

Question

Я пытаюсь использовать библиотеку greensock для анимации и использую пряжу, чтобы добавить библиотеку в мой проект, но файлы отображаются как «отключенное представление» (из-за отсутствия лучшего слова) в моем каталоге. Когда я пытаюсь использовать библиотеку в моем файле JS, я получаю ошибку Missing plugin? gsap.registerPlugin() в консоли браузера, и анимация не выполняется. Я пытался решить эту проблему с помощью gsap.registerPlugin(MotionPathPlugin, ScrollToPlugin, TextPlugin);, но это приводит к ошибке (в консоли браузера), что плагин не может быть найден. Есть идеи, как решить эту проблему? Что не так? Я также пытался использовать скрипт доставки CDN в моем HTML, но получал ту же ошибку Missing plugin? gsap.registerPlugin() в консоли браузера.

Любое понимание и помощь очень ценятся. Снимок экрана: снимок экрана с кодом VS

Answer 1

Вам необходимо импортировать плагины, которые вы хотите использовать в каждом файле, в котором вы хотите их использовать. Поэтому код в верхней части файла должен быть:

import { gsap } from "gsap";
import { MotionPathPlugin } from "gsap/MotionPathPlugin";
import { TextPlugin } from "gsap/TextPlugin";
import { ScrollToPlugin } from "gsap/ScrollToPlugin";

gsap.registerPlugin(MotionPathPlugin, TextPlugin, ScrollToPlugin);

Вы можете использовать страница установки GSAP , в частности, помощник по установке, чтобы помочь вам получить правильное форматирование в вашей системе.