Async/Lazy Carica componenti Vue con browserify

Question

Sto provando a caricare un numero di componenti Vue.js nel mio file app.js (utilizzando browserify/vueify via elixir) in un progetto laravel.

Invece di caricare ogni componente in una volta, mi piacerebbe caricare pigro i singoli componenti Vue quando sono necessari utilizzando vue router.

Dove è possibile impostare il file partition bundle json e come deve essere strutturato?

Al momento, Ive ha legato il seguito di un mie principali app.js di file:

import Vue from 'vue'; 
import Resource from 'vue-resource'; 
import VueRouter from 'vue-router'; 

// These are the components that I wish to lazy load: 
// import Users from './components/Users.vue'; 
// import Sales from './components/Sales.vue'; 
// import Projects from './components/Projects.vue'; 
// import Dashboard from './components/Dashboard.vue'; 
// import Receipts from './components/Receipts.vue'; 

Vue.use(Resource); 
Vue.use(VueRouter); 

var router = new VueRouter(); 

router.map({ 
    '/async': { 
    component: function (resolve) { 
     loadjs(['./components/Users.vue'], resolve) 
    } 
    } 
}) 

Ecco dove mi sono bloccato:

1. Come facciamo a carico pigri tutto .vue componenti elencati sopra nella funzione router.map?
2. Come impostare il file partition table json per quanto sopra e dove dovrebbe essere salvato?

Answer 1

Dalla documentazione https://vuejs.org/v2/guide/components.html#Async-Components

Se sei un utente Browserifyche vorrebbe utilizzare componenti asincroni, il suo creatore ha purtroppo messo in chiaro che asincrono loading “non è qualcosa che Browserify sosterrà mai. " Ufficialmente, almeno. La comunità di Browserify ha trovato alcune soluzioni alternative che potrebbero essere utili per applicazioni esistenti e complesse. Per tutti gli altri scenari, , consigliamo semplicemente di utilizzare Webpack per il supporto asincrono di prima classe integrato.