How do i add code to Nuxt or vue.js

1

i tried using :

    mounted: () => {
    const application = Stimulus.Application.start()
    application.register("viewport-entrance-toggle", class extends Stimulus.Controller {
      initialize() {
        this.intersectionObserver = new IntersectionObserver(entries => this.processIntersectionEntries(entries))
      }
      connect() {
        this.intersectionObserver.observe(this.element)
      }
      processIntersectionEntries(entries) {
        entries.forEach(entry => {
          this.element.classList.toggle(this.data.get("class"), entry.isIntersecting)
        })
      }
    })
    }

then added

 script: [
  {
    src:
      'https://polyfill.io/v2/polyfill.min.js?features=IntersectionObserver'
  }
]

to my nuxt,config file
but i keep getting a Stimulus not defined errors
I have also tried

import { Controller } from 'stimulus'

export default class extends Controller {
  initialize() {
    this.intersectionObserver = new IntersectionObserver(entries =>
      this.processIntersectionEntries(entries)
    )
  }
  connect() {
    this.intersectionObserver.observe(this.element)
  }
  disconnect() {
    this.intersectionObserver.unobserve(this.element)
  }
  // Private
  processIntersectionEntries(entries) {
    entries.forEach(entry => {
      this.element.classList.toggle(
        this.data.get('class'),
        entry.isIntersecting
      )
    })
  }
}

any get
SyntaxError: Unexpected token !
"Missing stack frames’

anyone know how i can resolve this

2

Here’s a codesandbox to my issue and the tutorial im following
sandbox → https://codesandbox.io/s/w72yvy8lx7
Tutorial → https://m.signalvnoise.com/how-to-back-to-top-button-without-scroll-events/#more-10661