vue3-vite动态路由导入组件不能使用模板字符串的问题

还原问题：

动态路由实现（参考博客）：https://blog.csdn.net/weixin_42510962/article/details/112618116

在我写动态路由的时候，菜单信息是从数据库中获取的。代码如下：

 let rts = []
// 设置动态路由
function setMoveRouter(menus){
    for (let i = 0; i < menus.length; i++) {
      let rt = {
          path: menus[i].menuPath,
          component: ()=>import('@/views/system/LoginLog.vue')  // 问题代码：暂时还没问题
          meta:{title:menus[i].menuName}
      }

      rts.push(rt)            //这里就将每个菜单的路由push进去了
  
      // if (menus[i].childMenuList && menus[i].childMenuList.length > 0) {  //当存在子菜单时
      //     setMoveRouter(menus[i].childMenuList)  //递归实现子菜单的路由设置
      // }
    }

刚开始被动态路由折磨了很久，为了一步步验证问题，暂时把导入组件写死了，。诶效果出来了，返回了对应的界面。

而后，我开始换成动态的时候，代码如下

component: ()=>import(`@/views/${menus[i].menuComponent}`)  // 问题代码：开始有问题了

报错了：我郁闷了，这路径没错啊，返回确认路径，及数据库路径，实在是没问题。

于是我打印路由信息： console.log(router.getRoutes())，第0个，点进去

而后百度这个异常异常：TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.s (<anonymous>:1:83

控制台也报警告：

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 不能这样导入组件。

解决方案：

官网：vite glob

那么献上我的案例吧：

const modules = import.meta.glob('@/views/*/*.vue')  // 导入
  
  function setMoveRouter(menus){
    for (let i = 0; i < menus.length; i++) 
      let rt = {
          path: menus[i].menuPath,
          component: modules[`@/views/${menus[i].menuComponent}`], // 这里  这里
          meta:{title:menus[i].menuName}
      }
      rts.push(rt)            //这里就将每个菜单的路由push进去了
    }