首先,通过下面代码告诉编译器要编译哪些页面
static modules = import.meta.glob('./views/**/*.vue');
然后动态加载函数这样写:
static asyncLoadView = (path: string) => {
return defineAsyncComponent({
loader: <any>Global.modules[`./views/${path}.vue`],
loadingComponent: LoadingView, // 加载中显示的组件
errorComponent: ErrorLoadView, // 加载出错显示的组件
delay: 500, // 在显示loadingComponent组件之前, 等待多长时间
timeout: 10000, // 加载超时的时间(毫秒)
/**
* err: 错误信息,
* retry: 函数, 调用retry尝试重新加载
* attempts: 记录尝试的次数
*/
onError: (err, retry, fail, attempts) => {
if (attempts < 2) {
window.setTimeout(retry, 1000);
}
else {
fail();
}
}
});
}