补间轻松和ESLINT

Tweenmax ease and ESLINT

本文关键字：ESLINT      更新时间：2023-09-26

我正在使用 Babel 的 ES6 transpiller 和 Tweenmax 作为我的动画库，它提供了一些存储缓动曲线的对象，例如 Back、Sine 等。

问题是我也在使用 Eslint，这些缓动对象违反了 no-undef 规则（我不想禁用）。

JS示例：

import TweenMax from 'gsap';
TweenMax.fromTo('.header__logo', .5, {y: -70, alpha: 0}, {y: 0, alpha: 1, delay: .4, ease: Back.easeOut});

安慰：

   97:98   error  "Back" is not defined         no-undef
   98:110  error  "Back" is not defined         no-undef
   99:109  error  "Back" is not defined         no-undef
  105:85   error  "Sine" is not defined         no-undef
  107:117  error  "Back" is not defined         no-undef
  108:125  error  "Back" is not defined         no-undef
  127:96   error  "Sine" is not defined         no-undef
  133:98   error  "Back" is not defined         no-undef
  134:151  error  "Back" is not defined         no-undef
  159:103  error  "Sine" is not defined         no-undef
  160:111  error  "Sine" is not defined         no-undef
  165:97   error  "Back" is not defined         no-undef
  166:109  error  "Back" is not defined         no-undef
  167:108  error  "Back" is not defined         no-undef

问题

如何让 TweenMax 缓动与 Eslint 一起使用？

好的，我已经想通了。

最快的方法是将 GSAP 变量添加到 .eslintrc 文件中的 globals 属性中

  "globals": {
    "TimelineLite" : false,
    "TimelineMax" : false,
    "TweenLite" : false,
    "TweenMax" : false,
    "Back" : false,
    "Bounce" : false,
    "Circ" : false,
    "Cubic" : false,
    "Ease" : false,
    "EaseLookup" : false,
    "Elastic" : false,
    "Expo" : false,
    "Linear" : false,
    "Power0" : false,
    "Power1" : false,
    "Power2" : false,
    "Power3" : false,
    "Power4" : false,
    "Quad" : false,
    "Quart" : false,
    "Quint" : false,
    "RoughEase" : false,
    "Sine" : false,
    "SlowMo" : false,
    "SteppedEase" : false,
    "Strong" : false,
    "Draggable" : false,
    "SplitText" : false,
    "VelocityTracker" : false, 
    "CSSPlugin" : false,
    "ThrowPropsPlugin" : false, 
    "BezierPlugin" : false
  }

从绿袜子论坛检索的属性

相关文章：