如何仅在 spa 需要时包含 vue 组件？

Question

我已经制作了组件并保存到不同的“.vue”文件中，并在 elixir / gulp 和 browserify 的帮助下编译它们。

我将所有组件都包含在一个 js 文件中，

我想知道如何减小每次在包含应用程序所有组件的每个页面中调用的“build.js”文件的大小。

了解这种只在需要时包含组件的方法会很有帮助。

This question is not related to Vue-router

I am new to vue.js

Answer 1

这是你的答案：http://router.vuejs.org/en/lazy.html

这在 Webpack 中是原生支持的。例子是：

require(['./MyComponent.vue'], function (MyComponent) {
  // code here runs after MyComponent.vue is asynchronously loaded.
})

如果你想用 Broswerify 来做，你需要 https://github.com/substack/browserify-handbook/blob/master/readme.markdown#partition-bundle 。代码如下：

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