Ich versuche, eine Anzahl von Vue.js Komponenten in meine app.js Datei (mit browserify/vueify via Elixir) in einem Laravel-Projekt zu laden.Async/Lazy Load Vue Komponenten mit browserify
Anstatt alle Komponenten gleichzeitig zu laden, möchte ich die einzelnen vue-Komponenten bei Bedarf mit vue router laden.
Wo kann ich die Datei partition bundle json
einrichten und wie sollte sie aufgebaut sein? Im Moment
, gebunden Ive aus der im Anschluss an eine meiner Haupt app.js Datei:
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)
}
}
})
Hier ist, wo ich stecke:
- Wie wir faul laden alle .vue Komponenten oben in der
router.map
Funktion aufgelistet? - Wie wird die
partition table json
Datei für die oben genannten eingerichtet, und wo sollte es gespeichert werden?
Ziemlich alte Frage, aber wenn jemand mehr Informationen zum Lazy Loading Komponenten benötigt. Hier ist ein Link zu den [docs] (https://router.vuejs.org/en/advanced/lazy-loading.html). – AWolf