目前应用vite搭建后盾管理系统,遇到了异步加载路由组件的问题,加上之前vue2的时候异步加载路由组件一起做个整顿,之前做过vue2,所以vue2和vue2一起做个整顿,先说vue3。

以后应用vue3创立动静组件路由办法

const dynamicRoutes = [   {        ...,        component: () => import('@/views/xx.vue')    }]

但通常的话后端会返回组件的地址,import里就会传个动静值,值为组件门路,但应用vite&vue3搭建的话会有告警

component: () => import(obj.componentPath)
The above dynamic import cannot be analyzed by Vite.See https://github.com/rollup/plugins/tree/master/packages/dynamic-import-vars#limitations for supported dynamic import formats. If this is intended to be left as-is, you can use the /* @vite-ignore */ comment inside the import() call to suppress this warning.

网上搜了vue3+vite有两种计划

  1. 应用vue3的API defineAsyncComponent加上正文 / @vite-ignore /
  2. 应用import.meta.glob 这种办法尝试后失败,就没深入研究
  3. shadowRef和defineAsyncComponent配合应用,还没尝试