javascript - single - Cómo registrar componentes globales con vue-router

vue single file components

Question

Estoy usando Vue.js con vue-cli. Elegí para la configuración del paquete web. Conecté el archivo main.js para el enrutamiento, aunque no puedo encontrar una forma de registrar globalmente mis componentes.

main.js

import Vue from ''vue''
import VueRouter from ''vue-router''
import App from ''./App''
import Companies from ''./components/pages/Companies''
import Income from ''./components/pages/Income''
import Login from ''./components/pages/Login''

Vue.use(VueRouter)

let router = new VueRouter()

router.map({
  ''/companies'': {
    component: Companies
  },
  ''/income'': {
    component: Income
  },
  ''login'': {
    component: Login
  }
})

router.start(App, ''body'')

App.vue

<template>
  <div>
    <router-view></router-view>
  </div>
</template>
<script>
import {Auth} from ''./lib/api''
import Loader from ''./components/Loader''

export default {
  components: {
    Loader
  },
  ready () {
    Auth.isLoggedIn().then(
      (response) => {
        if (response.data === false) {
          this.$router.go(''/login'')
        } else {
          this.$router.go(''/companies'')
        }
      },
      (response) => {
        this.$router.go(''/login'')
      }
    )
  }
}
</script>

Cuando uso mi componente Loader en alguna vista, aparece la siguiente advertencia.

[Advertencia Vue]: elemento personalizado desconocido: - ¿ha registrado el componente correctamente? Para componentes recursivos, asegúrese de proporcionar la opción "nombre".

Proporcioné el nombre en el componente y no hizo ninguna diferencia. Estoy usando el componente cargador en la vista de inicio de sesión.
Descubrí que debería definir el componente en el componente que voy a usar o globalmente. Sin embargo, no puedo encontrar la manera de definirlo globalmente con el enrutamiento.

Answer 1

La forma en que lo tiene configurado ahora, el componente cargador solo está disponible localmente en la plantilla del componente de la aplicación.

El enrutamiento no tiene influencia en el registro de componentes globales, solo hazlo sin un enrutador:

// main.js, before all the router stuff:
import Loader from ''./components/Loader''
Vue.component(''loader'', Loader)

o registrarlo localmente en su componente de inicio de sesión. Como ya lo hizo en App.vue, ya sabe qué hacer con Loader.vue