vue router动态路由点击空白,webpack4 import动态导入 路由懒加载

1.路由点击后空白
注意路径是否加了 / (斜杆)

{
          path: '/menu',  //<--这边 /menu如果是menu就会造成空白
          component: Layout,
          redirect: '/menu',
          children: [
            {
              path: 'menu',
              component: () => import('@/views/menu/index'),
              name: 'menu',
              meta: { title: '菜单管理', icon: 'dashboard' , roles: [''] }
            }
          ]
        }

使用webpack4的import不支持变量引入，或者说import语法不支持
我在做动态路由时候，代码如下，从后台请求到了路由列表，渲染出不来

let menu = await httpGet("/roleMenu/findMenuByUser?id="+store.getters.id)
          let menus = JSON.parse(menu).data
          let routes = []
          for(var item of menus){
            var route = {}
            const url = `@/views/${item.url}/index`
            route.path = '/'+item.url + ''
            route.component = Layout
            route.redirect= '/'+item.url+''
            route.children = [{
              path:item.url,
              component:resolve => require([`@/views/${item.url}`],resolve),
              name: item.url+ '',
              meta: { title: item.name , icon: 'dashboard' , roles: [''] }
            }]
            routes.push(route)
          }

解决，其实其他地方不用多说，就是这个component 引入太坑了，就不能官方支持下吗，都es6了

component: () => import('@/views/menu/index'), //字符串写死，可以
component: () => import('@/views/'+item.url+'/index'), 变量不行，解析会说找不到module
component:resolve => require([`@/views/${item.url}`],resolve),可以