上百個頁面，你們網(wǎng)站很牛逼，在下佩服。

你可以反過來思考這樣的兩個問題

1. 為什么一樣要手寫Router？
2. Router的所有功能都是我們需要的嗎？

Router是什么，他就像是一本字典，帶領(lǐng)你走向應(yīng)用的站點地圖。既然是字典，一一對應(yīng)不是更好嗎？既然能做一一對應(yīng)，也就不需要手寫，僅僅只需要進行一次目錄讀取即可。你可以使用nodejs進行預(yù)讀，也可以通過webpack進行預(yù)讀，按照文件的擺放結(jié)構(gòu)來生成路由。這個能解決第一個問題，至于第二個問題，其實大部分路由的功能我們是用不到的，或者可以封裝在你自己的框架中，以減少開發(fā)者的編寫和維護成本。
你可以參考一下nuxt.js，他里面的路由就是被抽象化了的，你只需要按要求合理的放文件和文件夾即可。

再一次提到require.context,按照一定結(jié)構(gòu)去放對應(yīng)文件就可以，可以適當(dāng)改變路由定義，支持懶加載

 const routes = [
    { path: '*', redirect: '/index' }
  ];
 importPages(require.context('./views', true, /\.vue$/,'lazy'))
 function importPages (r) {
    r.keys().forEach(key => {
      routes.push({ path: (key.split('.'))[1], component: ()=>r(key)})
    });
  }

肯定是能實現(xiàn)的, 現(xiàn)實中nuxt不就是自動掃描文件,自動生成路由嗎.

@buzzzzz 說的可以試試.
http://www.css88.com/doc/webp...

這個問題是來刷經(jīng)驗的

首先，如果有這個功能，官方文檔肯定會提及并且有詳細的使用教程的
其次，真是有上百個頁面的系統(tǒng)，使用Vue并不是那么適合
最后，還是乖乖一個一個的導(dǎo)入吧，反正我是不知道Vue提供了什么辦法可以一次性導(dǎo)入那么多文件

例如這樣
{
  "zh-CN": [
    {
      "name": "login",
      "path": "/login",
      "hidden": true
    },
    {
      "name": "dashboard",
      "path": "",
      "meta": { "title": "dashboard", "icon": "dashboard" },
      "children": [
        { 
          "path": "dashboard/index",  
          "name": "dashboardindex", 
          "meta": { "title": "dashboard", "icon": "dashboard" }
        }
      ]
    },
    {
      "path": "/form",
      "name": "form",
      "meta": {
        "title": "form",
        "icon": "form"
      },
      "children": [
        { 
          "path": "create",  
          "name": "create", 
          "meta": { "title": "createForm","icon": "" }
        },
        { 
          "path": "edit",  
          "name": "edit", 
          "meta": { "title": "editForm", "icon": ""}
        }
      ]
    }
  ]
}

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)
import Layout from '../views/layout/Layout'
import navConfig from './nav.config.json'
const LOAD_DOCS_MAP = {
  'zh-CN': (lang, path) => {
    return r => require.ensure([], () =>
      r(require(`../views${lang}/${path}.vue`)),
    'zh-CN');
  }
};

const loadDocs = function(lang, path) {
  return LOAD_DOCS_MAP["zh-CN"](lang, path);
};
const registerRoute = (navConfig) => {
  let route = [];
  navConfig.forEach((lang, index) => {
    let navs = lang.children;
    if(lang.children){
      route.push({
        path: lang.path,
        redirect: `${lang.path}/${lang.children[0].path}`,
        component: Layout,
        meta:lang.meta,
        children: []
      });
      navs.forEach(nav => {
          addRoute(nav, lang, index);
      });
    }else{
      if(lang.hidden){
        route.push({
          path: lang.path,
          component: loadDocs(lang.path,"index"),
          hidden: true,
          meta: {
            title: "",
            icon: ""
          },
        });
      }else{

      }
    }
  });
  function addRoute(page, lang, index) {
    const component = loadDocs(lang.path,page.path);
    let child = {
      path: page.path,
      meta: page.meta,
      name: page.name,
      component: component.default || component
    };

    route[index].children.push(child);
  }

  return route;
};

let route = registerRoute(navConfig["zh-CN"]);




export default new Router({
  // mode: 'history', // require service support
  scrollBehavior: () => ({ y: 0 }),
  routes: route,
})