Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
enisq

Angular 8 + gsap: Property 'quickSetter' does not exist on type 'typeof gsap'

Recommended Posts

Hi,

I am encountering this problem continuously although I have tried to do many manipulations with importing "@types". 
Version 3:

 Property 'quickSetter' does not exist on type 'typeof gsap'

 

Could someone pose a sample of implementation in Angular 8 + gaps.quickSetter property?

 

Thanks,

 

 

 

  • Thanks 1

Share this post


Link to post
Share on other sites

Hey enisq and welcome to the GreenSock forums!

 

Don't import @types. GSAP 3 comes with its own official and up to date Typescript definitions (though there may still be some minor errors here and there). You should uninstall any other definitions for GSAP.

  • Like 2

Share this post


Link to post
Share on other sites
6 minutes ago, ZachSaucier said:

Hey enisq and welcome to the GreenSock forums!

 

Don't import @types. GSAP 3 comes with its own official and up to date Typescript definitions (though there may still be some minor errors here and there). You should uninstall any other definitions for GSAP.

Thanks for reply Zach.

To make sure I not mix anything, this is what I run:

 ng new testprj
npm install --save gsap
ng serve.

this is the code:

 

import 'gsap';

ngOnInit(): void {
  gsap.set(".ball", {xPercent: -50, yPercent: -50});

  const ball = document.querySelector(".ball");
  const pos = { x: window.innerWidth / 2, y: window.innerHeight / 2 };
  const mouse = { x: pos.x, y: pos.y };
  const speed = 0.1;

  const xSet = gsap.quickSetter(ball, "x", "px");
  const ySet = gsap.quickSetter(ball, "y", "px");

  window.addEventListener("mousemove", e => {
    mouse.x = e.x;
    mouse.y = e.y;
  });

  gsap.ticker.add(() => {
    pos.x += (mouse.x - pos.x) * speed;
    pos.y += (mouse.y - pos.y) * speed;
    xSet(pos.x);
    ySet(pos.y);
  });
}

but I still get the same output:

 

 Property 'quickSetter' does not exist on type 'typeof gsap'.
for both xSet and ySet.

Any opinions,please?

Share this post


Link to post
Share on other sites

Hi @enisq 

 

Thanks for pointing this. You are correct, the quickSetter definition is missing. Standby while I come up with a temporary workaround.

 

Also note that import "gsap" won't work correctly in v3 once you do a production build. You will need to specify what to import, like:

 

import { gsap } from "gsap";

 

https://greensock.com/docs/v3/Installation#modules

 

  • Like 3

Share this post


Link to post
Share on other sites

Ok, here is how to workaround the missing definition for now. 

 

Create a .d.ts file in your project, like typings.d.ts. Then add the following code to that file. It should resolve that error for you.

 

declare namespace gsap {
  function quickSetter(target: TweenTarget, property: string, unit?: string): (value: any) => void;
}

 

We'll make sure that the next release of gsap will include the quickSetter definition.

  • Like 2
  • Thanks 2

Share this post


Link to post
Share on other sites
8 minutes ago, OSUblake said:

Ok, here is how to workaround the missing definition for now. 

 

Create a .d.ts file in your project, like typings.d.ts. Then add the following code to that file. It should resolve that error for you.

 


declare namespace gsap {
  function quickSetter(target: TweenTarget, property: string, unit?: string): (value: any) => void;
}

 

We'll make sure that the next release of gsap will include the quickSetter definition.

Thank you, this workaround works.

 

 

Great community :)

  • Like 2

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.

×