How do I add KS-Vue-Scrollmagic to middleware?

digisocialnet commented 6 years ago

I tried using your plugin but am having trouble accessing it from my middleware file. this.$gsap doesn't work and I tried a lot of variations of:

if (process.browser) { require('external_library') }

I tried context too (and process.browser):

`export default function ({ store }) { if (store.state.menuIsActive === !false) { if (process.browser) { var tl = new context.app.$gsap.TimelineMax()

  var slide = document.querySelector('#slide-menu')
  var nl = document.querySelectorAll('.navlink')

  if (store.state.menuIsActive === true) {
    console.log('initmenu')
    tl
      .staggerTo(
        nl,
        store.state.animParams.dur3,
        { y: '10px', autoAlpha: 0, ease: store.state.animParams.ease },
        store.state.animParams.dur2
      )
      .to(slide, 0.5, { y: '-100%', ease: store.state.animParams.elastic })
    store.commit('setMenuState', false)
  }
}

} } `

pirony commented 6 years ago

Hi @digisocialnet I don't know if the issue comes from here, but there's a typo in your code; it should be:

export default function ({ store, app }) {
  // and then
    var tl = new app.$gsap.TimelineMax()
}

Let me know if it does the trick ;)

digisocialnet commented 6 years ago

it didn't but this worked: https://github.com/nuxt/nuxt.js/issues/2347#issuecomment-350235184

pirony / ks-vue-scrollmagic

How do I add KS-Vue-Scrollmagic to middleware? #3