一直都習(xí)慣在一個(gè)router.js 去編寫自己的路由功能，但是發(fā)現(xiàn)當(dāng)項(xiàng)目菜單增多(包括一些子路由)，功能變多，router.js 代碼也會(huì)越來越長(zhǎng)，就會(huì)變得不是那么容易管理，多人合作也會(huì)不是特別一目了然的感覺。
像這種

const router = new Router({
    routes: [
        {
            path: '/login',
            name: 'login',
            component: resolve => require(['@/components/login'], resolve)
        },
        {
            path: '/index',
            name: 'index',
            component: resolve => require(['@/components/index'], resolve),
            children: [
                // 課程管理
                {
                    path: '/lesson',
                    name: 'lesson',
                    component: resolve => require(['@/components/lesson'], resolve),
                },
                {
                    path: '/lesson/editLesson',
                    name: 'editLesson',
                    component: resolve => require(['@/components/lesson/editLesson'], resolve)
                },
                {
                    path: '/lesson/excelLesson',
                    name: 'excelLesson',
                    component: resolve => require(['@/components/lesson/excelLesson'], resolve)
                },
                {
                    path: '/lesson/excelLesson/excelEdit',
                    name: 'excelEdit',
                    component: resolve => require(['@/components/lesson/excelEdit'], resolve)
                },
                // 資源管理
                {
                    path: '/resources',
                    name: 'resources',
                    component: resolve => require(['@/components/resources'], resolve)
                },
                // 數(shù)據(jù)統(tǒng)計(jì)
                {
                    path: '/statistics',
                    name: 'statistics',
                    component: resolve => require(['@/components/statistics'], resolve)
                },
                // 活動(dòng)管理
                {
                    path: '/activity',
                    name: 'activity',
                    component: resolve => require(['@/components/activity'], resolve)
                },
                {
                    path: '/activity/editActivity',
                    name: 'editActivity',
                    component: resolve => require(['@/components/activity/editActivity'], resolve)
                },
                {
                    path: '/activity/lockConfig',
                    name: 'lockConfig',
                    component: resolve => require(['@/components/activity/lockConfig'], resolve)
                },
                {
                    path: '/activity/msgConfig',
                    name: 'msgConfig',
                    component: resolve => require(['@/components/activity/msgConfig'], resolve),
                    children: [
                        {
                            path: '/activity/liebian/msgUnLock',
                            name: 'lb_msgUnLock',
                            component: resolve => require(['@/components/activity/liebian/msgUnLock'], resolve)
                        },
                        {
                            path: '/activity/liebian/msgStudy',
                            name: 'lb_msgStudy',
                            component: resolve => require(['@/components/activity/liebian/msgStudy'], resolve)
                        },
                        {
                            path: '/activity/xuqi/msgUnLock',
                            name: 'xq_msgUnLock',
                            component: resolve => require(['@/components/activity/xuqi/msgUnLock'], resolve)
                        },
                        {
                            path: '/activity/xuqi/msgStudy',
                            name: 'xq_msgStudy',
                            component: resolve => require(['@/components/activity/xuqi/msgStudy'], resolve)
                        },
                        {
                            path: '/activity/xuqi/msgRenewal',
                            name: 'xq_msgRenewal',
                            component: resolve => require(['@/components/activity/xuqi/msgRenewal'], resolve)
                        },
                    ]
                },
                // 消息模板管理
                {
                    path: '/template',
                    name: 'template',
                    component: resolve => require(['@/components/template'], resolve)
                },
                {
                    path: '/template/editTemplate',
                    name: 'editTemplate',
                    component: resolve => require(['@/components/template/editTemplate'], resolve)
                },
                // 集合頁管理
                {
                    path: '/collection',
                    name: 'collection',
                    component: resolve => require(['@/components/collection'], resolve)
                },
                {
                    path: '/collection/editCollection',
                    name: 'editCollection',
                    component: resolve => require(['@/components/collection/editCollection'], resolve)
                },

                /* ------- */
                /* 更多代碼 */
                /* ------- */
            ]
        }, 
        ,{
            path: '*',
            redirect: '/login'
        }
    ]
})

一開始想的是希望像組件一樣，新建一些路由文件夾，寫上對(duì)應(yīng)的路由js，import 引入這種方式，然后push到children里，但是發(fā)現(xiàn)，由于下級(jí)子路由的存在，然后就不知道怎么去處理這個(gè)問題了╮(╯_╰)╭ 總是覺得還是不夠優(yōu)雅...