在之前,生成一个页面,要去route路由文件里面添加相应的路由对象,如果是新建的路由模块还要去主index.js引入路由文件一系列操作..
然后现在只需要一个路由index.js文件 ------懒加载的哦!!!!!
import Vue from 'vue'
import Router from 'vue-router'
// 重写原型链push方法防止报错
const originalPush = Router.prototype.push
Router.prototype.push = function push(location, onResolve, onReject) {
if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject)
return originalPush.call(this, location).catch(err => err)
}
Vue.use(Router)
// 自动抓取路由
// 获取views文件夹下面所有的vue文件
const views = require.context('../views', true, /\/.*\.vue$/)
let generator = []
// 遍历文件名字
views.keys().map(key => {
// 生成对应的路由对象
let route = {
path: key.slice(1, -4).toLowerCase(),
component: () => import(`../views${key.slice(1)}`) //懒加载的!
}
generator.push(route)
})
// 主导航下面的子页面
const routes = [{
path: '/',
name: 'free',
component: () => import('../views/Home.vue')
},
...generator,
{
path: '*',
name: 'Error',
component: () => import('../views/Error.vue')
}
]
console.log(routes);
const router = new Router({
mode: 'history',
base: process.env.BASE_URL,
routes
})
export default router