Why

当网站架构庞大后，会造成 router.js 档案巨大，引入的元件众多而难以管理。
切割档案再进行引用，会使路径较易管理搜寻。

Vue-Cli 模板範例

Github Repo Link

router.js

import Vue from 'vue'import Router from 'vue-router'// 引用其他 router 档案import fin_Routes from './routes/finReportRoutes'import baseRoutes from './routes/baseRoutes'Vue.use(Router)export default new Router({  routes: [    // ES6 rest parameter 会将两个阵列合併    ...baseRoutes,    ...fin_Routes  ],})

切割的 Route 档案

import FinReportPage from '@/views/fin-report/FinReportPage'export default [  {    path: '/fin-report',    name: 'fin-report',    component: FinReportPage,  },]

参考资料