我想尝试延迟使用webpack加载。我按路线划分了我的应用程序,并且每条路线都有必需的组件:

const Home = resolve => {
    require.ensure([ "../components/Home/Home.vue" ], () => {
        resolve(require("../components/Home/Home.vue"));
    });
};

每次去不同的路线时,我都会将大块放在单独的文件夹中:bundle1.js, bundle2.js, bundle3.js为 route 的每个组件开启。

现在,我不知道如何仅加载该路由所需的包?如果我将bundle.js放入 index.html 中,它将加载整个 bundle 包,但是我只想加载该路线所需的唯一 bundle 包?
  <body>
    <div id="app"></div>
    <!-- how to auto inject build files here?? -->
  </body>

Vue组件的Lazy Loading一节。我这样做了,我得到了一大堆 bundle 文件。 但我不知道什么是包含它们并加载的正确方法。

任何帮助表示赞赏。谢谢

最佳答案

您可以在此处找到有关如何实现该目标的文档:

  • https://router.vuejs.org/en/advanced/lazy-loading.html
  • https://vuejs.org/v2/guide/components.html#Async-Components
  • 关于webpack - 使用Webpack 2延迟加载Vue组件,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/42352100/

    10-16 19:51