vue3出现Error: Unknown variable dynamic import

javascript 复制代码
Unknown variable dynamic import
前端做动态路由权限

   component = () => import(`../views/${url}/${url}.vue`)
1
解决方法:

  // 首先把你需要动态路由的组件地址全部获取
   
 let modules = import.meta.glob('../views/**/*.vue')
 
 // 然后动态路由的时候这样来取
 component = modules[`../views/${url}/${url}.vue`]

自定义案例
 navigationList.forEach( navigation => {
      let modules = import.meta.glob('../views/**/*.vue')
      router.addRoute('index', {
        path: navigation.url,
        // meta: { name: navigation.name, icon: navigation.icon },
        name: navigation.name,
        component: modules[`../views${navigation.url}${navigation.url}.vue`],
      })
    })
    console.log(router.getRoutes(), '查看现有路由')
    next()
  }
相关推荐
董员外13 分钟前
从零实现 AI 编程助手:LangChain.js + ReAct 循环实战
前端·javascript·后端
于先生吖13 分钟前
2026 新版 Java 同城上门家政服务系统源码 完整可运营
java·开发语言
bluceli14 分钟前
JavaScript BigInt:处理大数值的终极解决方案
前端·javascript
MIXLLRED17 分钟前
Python模块详解(一)—— socket 和 threading 模块
开发语言·python·socket·threading
软弹20 分钟前
Vue2、Vue3、React 状态管理全方位对比
前端·javascript·vue.js·react.js
csbysj202021 分钟前
桥接模式(Bridge Pattern)
开发语言
BYWled23 分钟前
告别 Date | JavaScript Temporal API 使用教程
javascript
Yupureki33 分钟前
《C++实战项目-高并发内存池》4.CentralCache构造
c语言·开发语言·c++·单例模式·github
2401_8980751236 分钟前
分布式系统监控工具
开发语言·c++·算法
酉鬼女又兒1 小时前
HTML基础实例样式详解零基础快速入门Web开发(可备赛蓝桥杯Web应用开发赛道) 助力快速拿奖
前端·javascript·职场和发展·蓝桥杯·html·html5·web