javascript - ESLint 提示 Angular 应用程序中的 GreenSock

Question

我正在开发一个小型 Angular 应用程序，它使用 GreenSock 的 Draggable 插件。一切都按预期进行；但是，我正在使用 ESLint，它提示 TweenMax 和 Draggable 未定义。

74:7   error  "Draggable" is not defined                                            
133:7   error  "TweenMax" is not defined
133:78  error  "Bounce" is not defined

我有一个函数可以在我的 Controller 中设置一个可拖动元素，并在 Controller 中设置一些补间:

// Set up GreenSock Draggable dial
function setUpDraggableElement(element) {
  Draggable.create(element, {
    type: 'rotation',
    onPress: onDialTouch,
    onRelease: onDialRelease,
    onDrag: onRotateDial,
    liveSnap: function(endValue) {
      return Math.round(endValue / 20) * 20;
   }
  });
}

...

TweenMax.to(angular.element('.selector'), 0.5, { scale: 1.1, ease: Bounce.easeOut});

我是 Angular 新手；我需要将它们包装在某种指令或其他东西中吗？

Answer 1

如果您的应用程序按预期工作，我相信这只是 ESLint 的问题。

GSAP 在一个文件中(或在其自己的文件中)定义“Draggable”、“TweenMax”和“Bounce”，并且您在不同的文件中使用这些名称。 ESLint 单独查看文件，因此警告名称尚未定义。

您需要做的是通知 ESLint “Draggable”、“TweenMax”和“Bounce”是全局变量(在文件外部定义)。像这样的事情:

/*global Draggable, TweenMax, Bounce*/