Events.js

import e from '@unseenco/e' // Event emitter, I use my friend Jake's, since its great, but could also use TinyEmitter for example
const Events = new e()

export default Events

main.js

// Make sure u import ur global raf at least once somewhere, I usually do that in my main.js file

import Raf from './Raf'

class App {
 // My main class 
}

new App()

Raf.js

import gsap from 'gsap'

import Events from './Events'

class Raf {

  constructor() {
    gsap.ticker.add(this.tick)
  }

  tick = () => {
    Events.emit('tick')
    
    /*
    in my personal core I calc and emit scroll and mouse values,
    so I can access these in any file that might need them.
    
    Events.emit('tick', {
      target: this.target,
      current: this.currentRounded,
      mouse: this.mouse
    })
    */
  }
}

export default new Raf()

SomeComponent.js

// Example component where I need the raf

import Events from './Events'

export default class {
  
  constructor() {
    this.init()
  }
  
  init() {
    this.addEvents()
  }
 
  run = ({ current, mouse }) /* my scroll and mouse get passed like params */ => {
    // Do some component specific raf stuff
  }
  
  addEvents() {
    // Listen to raf
    Events.on('tick', this.run) 
  }

  removeEvents() {
    // Stop listening to raf
    Events.off('tick', this.run)
  }

  destroy() {
    // Remove events and cleanup class
    this.removeEvents()
  }
}