Skip to main content

Archive

Show more

Installing GSAP

Installing GSAP

GSAP (GreenSock Animation Platform) can be installed in your web projects using either a CDN (Content Delivery Network) or npm (Node Package Manager). Below are detailed instructions for both methods:


1. CDN (Content Delivery Network)

Using a CDN is the quickest way to get started with GSAP. Follow these steps:

  1. Open your HTML file where you want to use GSAP.
  2. Insert the following script tag in the head or body section of your HTML:
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.9.1/gsap.min.js"></script>

This script tag will fetch the latest version of GSAP from the CDN and make it available for use in your project.


2. npm (Node Package Manager)

If you prefer managing dependencies using npm, you can install GSAP as follows:

  1. Open your terminal or command prompt.
  2. Navigate to your project directory.
  3. Run the following npm command to install GSAP:
$ npm install gsap

This command will download and install the latest version of GSAP and add it to your project's node_modules directory.

After installation, you can import GSAP into your JavaScript files using ES6 import syntax or CommonJS require syntax.


Conclusion

Installing GSAP is straightforward and can be done using either a CDN or npm, depending on your preference and project setup. The CDN method is quick and easy, providing immediate access to GSAP's features by adding a single script tag to your HTML file. On the other hand, using npm allows for better package management and integration with build tools, making it suitable for larger or more complex projects.

Once installed, GSAP provides a powerful set of tools for creating high-performance animations on the web, making it a valuable addition to any web developer's toolkit.

Comments