extra-plugins

Extra Plugins

• Type: object
• Default: undefined

Specifies GSAP extra plugins.

Flip

• Type: boolean
• Default: undefined

// nuxt.config.ts

{
  gsap: {
    extraPlugins: {
      flip: true
    }
  }
}

Available globally

const { $Flip } = useNuxtApp()

useFlip

• Custom composable

// nuxt.config.ts

{
  gsap: {
    composables: true,
    extraPlugins: {
      flip: true
    }
  }
}

Usage

useFlip

// Explicit import (optional)
import { useFlip } from '#gsap'

ScrollTrigger

• Type: boolean
• Default: undefined

// nuxt.config.ts

{
  gsap: {
    extraPlugins: {
      scrollTrigger: true
    }
  }
}

Available globally

const { $ScrollTrigger } = useNuxtApp()

useScrollTrigger

• Custom composable

// nuxt.config.ts

{
  gsap: {
    composables: true,
    extraPlugins: {
      scrollTrigger: true
    }
  }
}

Usage

useScrollTrigger

// Explicit import (optional)
import { useScrollTrigger } from '#gsap'

Observer

• Type: boolean
• Default: undefined

// nuxt.config.ts

{
  gsap: {
    extraPlugins: {
      observer: true
    }
  }
}

Available globally

const { $Observer } = useNuxtApp()

useObserver

• Custom composable

// nuxt.config.ts

{
  gsap: {
    composables: true,
    extraPlugins: {
      observer: true
    }
  }
}

Usage

useObserver

// Explicit import (optional)
import { useObserver } from '#gsap'

ScrollTo

• Type: boolean
• Default: undefined

// nuxt.config.ts

{
  gsap: {
    extraPlugins: {
      scrollTo: true
    }
  }
}

Available globally

const { $ScrollToPlugin } = useNuxtApp()

useScrollToPlugin

• Custom composable

// nuxt.config.ts

{
  gsap: {
    composables: true,
    extraPlugins: {
      scrollTo: true
    }
  }
}

Usage

useScrollToPlugin

// Explicit import (optional)
import { useScrollToPlugin } from '#gsap'

Draggable

• Type: boolean
• Default: undefined

// nuxt.config.ts

{
  gsap: {
    extraPlugins: {
      draggable: true
    }
  }
}

Available globally

const { $Draggable } = useNuxtApp()

useDraggable

• Custom composable

// nuxt.config.ts

{
  gsap: {
    composables: true,
    extraPlugins: {
      draggable: true
    }
  }
}

Usage

useDraggable

// Explicit import (optional)
import { useDraggable } from '#gsap'

Easel

• Type: boolean
• Default: undefined

// nuxt.config.ts

{
  gsap: {
    extraPlugins: {
      easel: true
    }
  }
}

Available globally

const { $EaselPlugin } = useNuxtApp()

useEaselPlugin

• Custom composable

// nuxt.config.ts

{
  gsap: {
    composables: true,
    extraPlugins: {
      easel: true
    }
  }
}

Usage

useEaselPlugin

// Explicit import (optional)
import { useEaselPlugin } from '#gsap'

MotionPath

• Type: boolean
• Default: undefined

// nuxt.config.ts

{
  gsap: {
    extraPlugins: {
      motionPath: true
    }
  }
}

Available globally

const { $MotionPathPlugin } = useNuxtApp()

useMotionPathPlugin

• Custom composable

// nuxt.config.ts

{
  gsap: {
    composables: true,
    extraPlugins: {
      motionPath: true
    }
  }
}

Usage

useMotionPathPlugin

// Explicit import (optional)
import { useMotionPathPlugin } from '#gsap'

Pixi

• Type: boolean
• Default: undefined

// nuxt.config.ts

{
  gsap: {
    extraPlugins: {
      pixi: true
    }
  }
}

Available globally

const { $PixiPlugin } = useNuxtApp()

usePixiPlugin

• Custom composable

// nuxt.config.ts

{
  gsap: {
    composables: true,
    extraPlugins: {
      pixi: true
    }
  }
}

Usage

usePixiPlugin

// Explicit import (optional)
import { usePixiPlugin } from '#gsap'

Text

• Type: boolean
• Default: undefined

// nuxt.config.ts

{
  gsap: {
    extraPlugins: {
      text: true
    }
  }
}

Available globally

const { $TextPlugin } = useNuxtApp()

useTextPlugin

• Custom composable

// nuxt.config.ts

{
  gsap: {
    composables: true,
    extraPlugins: {
      text: true
    }
  }
}

Usage

useTextPlugin

// Explicit import (optional)
import { useTextPlugin } from '#gsap'