Come registrare componenti globali con vue-router

Question

Sto utilizzando Vue.js con il vue-cli. Ho scelto per l'installazione del webpack. Ho cablato il file main.js per il routing, sebbene non riesca a trovare un modo per registrare globalmente i miei componenti.

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> 

Quando uso il mio componente Loader in qualche vista, ottengo il seguente avviso.

[Vue warn]: elemento personalizzato sconosciuto: - il componente è stato registrato correttamente? Per i componenti ricorsivi, assicurati di fornire l'opzione "nome".

Ho fornito il nome nel componente e non ha fatto alcuna differenza. Sto usando il componente loader nella vista login.
Ho scoperto che dovrei definire il componente nel componente che sto per usarlo o globalmente. Tuttavia, non riesco a scoprire come definirlo globalmente con il routing.

Answer 1

Il modo in cui è stato impostato ora, Il componente caricatore è disponibile solo localmente nel modello del componente App.

Routing non ha alcuna influenza sulla registrazione componente globale, basta farlo come senza un router:

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

o registrati localmente nel componente Login. Come già fatto in App.vue, sai cosa fare con Loader.vue