vue嵌套路由不可跳转问题

今天做路由设计，写个普通二级路由。因为项目比较大，用上了路由懒加载。

    {
      path: "/:area/sale",
      component: () =>
        import("./views/sale.vue"),
      children: [{
        path: '',
        component: () =>
        import("./views/totle.vue"),
      }]
    }

类似这种路由。
但是再点击的时候怎么都不能正常跳转，百度，必应了下也没找到原因。
最后一点点测试才发现二级路由不支持懒加载，必须提前import进来。

import groupSale from './views/group/sale/sale.vue';
import groupTotal from './views/group/sale/total.vue';
    {
      path: "/:area/sale",
      component: groupSale,
      children: [{
        path: '',
        component: groupTotal
      }]
    }

改成这样就好了。
项目比较紧张，先记录一下。回头找原因。