How to use meteor + Vue + useraccounts?

I’m currently building my first app with meteor and vue and try to integrate the useraccounts:core / bootstrap package.

It seems that there are people that managed to use the useraccounts:* packages together with a Vue project, e.g. Proper handling of computed property with vue-meteor-tracker

However, I didn’t manage yet to get this working. I created a login page using vuejs:blaze-integration.

Login.vue

<template>
  <div>
    <blaze-template template="atForm" tag="span" />
  </div>
</template>

I started using the VueRouter (as I managed to get this working together with Vue and I’m familiar with it anyway). Router initialization:

/* global Meteor:false */
import Vue from "vue"
import VueRouter from "vue-router"
import { routes } from "./routes"

Vue.use(VueRouter)
export const router = new VueRouter({
  routes, // short for `routes: routes`
})

// check if used has been logged in
router.beforeEach((to, from, next) => {
  if (!to) next()
  console.log("navigate to", to.name, "user", Meteor.user())
  if (to.name !== "login" && !Meteor.user()) next({ name: "login" })
  else next()
})

routes.js:

import Login from "/imports/ui/layouts/Login.vue"
//...

export const routes = [
  {
    path: "/login",
    name: "login",
    component: Login,
  },
  {
    path: "/",
    component: AppLayout,
    children: [
       //...
     ]
  }
]

With this setup, the signin page shows up and I also also navigate to the register form. (I guess it stays within the form.)

However, as soon as I login, the app stays blank, even after reload. (If I clear all site data I can restart with login again.)

I guess that I need to add some navigation information from /login to /?

Or should I wrap my AppLayout with an v-if to check whether the user is logged in and switch between login and main app there?

Any suggestions?

Is there any documentation available about this case or any sample project?

Thanks!

Hi @peter11 ,

Finally, did you manage to have useraccounts:core package working with vueRouter?