Could I use this out of Vue Component?

[thearabbit]

I base on Meteor.
I check Progressbar on Meteor Startup

import VueProgressBar from 'vue-progressbar'

Meteor.startup(() => {
  // Before each
  router.beforeEach((to, from, next) => {
    VueProgressBar.start()

    if (!to.meta.notRequiresAuth) {
      // Check user
      if (!Meteor.loggingIn() && !Meteor.userId()) {
        next({ path: '/login' })
      } else {
        next()
      }
    } else {
      next()
    }
  })

  // // After each
  router.afterEach((to, from) => {
    VueProgressBar.finish()
  })

  // Start the vue app
  new Vue({
    router,
    store,
    ...AppLayout,
  }).$mount('app')
})

Bc I use check router hook in App Layout don't work

[malinbranduse]

@thearabbit Haven't tested it but you could do something like this:

import VueProgressBar from 'vue-progressbar'
Vue.use(VueProgressBar )

Meteor.startup(() => {
  // Start the vue app
  const app = new Vue({
    store,
    ...AppLayout,
  }).$mount('app')

  // Before each
  app.$router.beforeEach((to, from, next) => {
    app.$Progress.start()

    if (!to.meta.notRequiresAuth) {
      // Check user
      if (!Meteor.loggingIn() && !Meteor.userId()) {
        next({ path: '/login' })
      } else {
        next()
      }
    } else {
      next()
    }
  })

  // // After each
  app.$router.afterEach((to, from) => {
    app.$Progress.finish()
  })
})

[thearabbit]

Thank for your reply, I will try soon

[thearabbit]

It work for Progressbar, but don't work my Authentication

[thearabbit]

Have any solve?

[thearabbit]

Waiting...

[rijkvanzanten]

Is your authentication a route change within Vue, or do you only initialize Vue itself after the user has logged in?