Vue Webpack加载代码拆分文件和show loader

Question

我目前正在使用Vue和Vue-Webpack进行代码分割。

在我的router / index.html中，我做了类似的事情：

const Dashboard = () => import(/* webpackChunkName: "dashboard" */ '@/components/Dashboard.vue');

这很好用，正在加载组件，但没有向用户显示加载反馈。我是否可以在请求加载组件的用户和实际完成组件之间注入任何代码？

干杯， 欧文

Answer 1

动态导入会返回一个承诺，因此您应该可以执行以下操作：

Dashboard.then(() => {
    // Remove your spinner or loading animation.
})

在导入之前，您始终会显示您的微调器，并且在then决心中，您将删除它。

Haven在动态导入方面做了那么多工作，所以这可能不起作用。