问题描述：

本地npm run dev,路由加载正常，打包后，预览npm run preview时，就会出现下面问题

解决：

构建生产版本 | Vite 官方中文文档

在整理路由的位置引入

const modules = import.meta.glob("../views/**/**.vue");

这是后端返回的菜单

    const menuList = [
      {
        name: 'deviceManage',
        label: '设备管理',
        icon: 'location',
        children:[
          {
            path: '/deviceManage/device-list',
            label: '设备列表',
            name: 'device-list',
          },
          {
            path: '/deviceManage/device-analysis',
            label: '统计分析',
            name: 'device-analysis',
          }
        ]
      },
    ]

整理为需要的动态路由: 使用引入的 modules

component: modules[`../views${childItem.path}.vue`]

menu.forEach(menuItem => {
  const parentItem = {
    path: menuItem.path, // 你的路径
    component: () => import('@/views/Main.vue'), // 你的组件路径
    name: menuItem.name,
    meta: { title: menuItem.label },
    children: [],
  };

  menuItem.children.forEach(childItem => {
    let childUrl = `/src/views${childItem.path}.vue`
    console.log('childUrl',childUrl);
    const childRoute = {
      path: childItem.path,
      name: childItem.name,
      meta: { title: childItem.label },
      component: modules[`../views${childItem.path}.vue`]
    };
    parentItem.children.push(childRoute);
    list.push(parentItem);
  });
});
list.forEach(item => {
  router.addRoute(item)
})

 查看当前的路由列表

      console.log('查看路由列表',router.getRoutes())