support plugins config for gsap.registerPlugin

Author: drc0

README.md

@@ -48,13 +48,14 @@ yarn add nuxt-gsap # or npm install nuxt-gsap
 ```
 ## options
 
-You can pass different options using module inline options:
+You can pass different options using module inline options, with gsap 3 you probably want to use only plugins:
 
 ```js
   buildModules: [
     'nuxt-gsap', [
       {
-        imports: ['Back', 'Circ'] // Specify the gsap modules you want to import. By default, gsap & Linear are loaded
+        imports: ['Power2'], // Specify the gsap modules you want to import. By default, gsap is loaded
+        plugins: ['PixiPlugin', 'ScrollTrigger'] // Various plugins to load, gsap.registerPlugin() will be called on each of them 
       }
     ]
   ]
@@ -67,7 +68,8 @@ or nuxtGsap section in nuxt.config.js
     'nuxt-gsap'
   ],
   nuxtGsap: {
-    imports: ['Back', 'Circ'] // Specify the gsap modules you want to import. By default, gsap & Linear are loaded
+    imports: ['Power2'], // Specify the gsap modules you want to import. By default, gsap is loaded
+    plugins: ['PixiPlugin', 'ScrollTrigger'] // Various plugins to load, gsap.registerPlugin() will be called on each of them 
   }
 ```
 
@@ -89,7 +91,7 @@ index.vue
 export default {
   mounted () {
     this.$nextTick(() => { // When using $refs, must wait for nextTick
-      const tl = this.$gsap.timeline({ repeat: -1, ease: this.$gsap.Linear.easeInOut(2) })
+      const tl = this.$gsap.timeline({ repeat: -1, ease: this.$gsap.Power2.easeInOut(2) })
       tl.to('.test', 2, { x: 200 }) // With css selector
       tl.to(this.$refs.test, 0.5, { x: 0 }) // With refs
     })

lib/module.js

@@ -5,11 +5,11 @@ module.exports = function gsapNuxtModule (moduleOptions) {
     ...this.options['nuxt-gsap'],
     ...moduleOptions
   }
-  const DefaultImports = ['gsap', 'Linear']
+  const DefaultImports = ['gsap']
   options.imports = [
     ...(options.imports || []),
     ...DefaultImports
-  ].join(', ')
+  ]
 
   this.options.build.transpile.push('gsap')
   this.addPlugin({

lib/plugin.js

@@ -1,11 +1,19 @@
-import {<%= options.imports %>} from "gsap"
+import {<%= options.imports.join(', ') %>} from "gsap"
 const activated = [
-    gsap, <%= options.imports %>
+  <%= options.imports.join(', ') %>
 ]
+<% if (options.plugins) { %>
+<% options.plugins.map(p => { %>
+ import { <%= p %> } from "gsap/<%= p %>.js"
+<% }); %>
+<% } %>
+
 export default async  (context, inject) => {
-  const OptionsObject = {
-    <%= options.imports %>
+  <% options.imports.map(i => { %>
+    gsap[<%= i %>] = <%= i%>
+  <% }) %>
+  if (process.client) {
+    gsap.registerPlugin(<%= options.plugins %>)
   }
-  Object.keys(OptionsObject).forEach(key => gsap[key] = OptionsObject[key] )
   inject('gsap', gsap)
-}
+}

package.json

@@ -20,7 +20,7 @@
     "test": "yarn lint && jest"
   },
   "dependencies": {
-    "gsap": "^3.2.5"
+    "gsap": "^3.6.0"
   },
   "devDependencies": {
     "@babel/core": "latest",