javascript - 使用 browserify 异步/延迟加载 Vue 组件

Question

我正在尝试在 laravel 项目中将一些 Vue.js 组件加载到我的 app.js 文件中（通过 elixir 使用 browserify/vueify）。

我不想一次加载每个组件，而是想在需要时使用vue router延迟加载各个 vue 组件。

我在哪里设置partition bundle json文件以及应该如何构建文件？

目前，我将以下内容绑定到我的主要app.js文件中：

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)
    }
  }
})

这是我卡住的地方：

1. 我们如何在router.map函数中延迟加载上面列出的所有 .vue 组件？
2. 如何设置上述partition table json文件，应该保存在哪里？

Answer 1