自动生成路由js文件:autoRouter.js
let routeArr = [];
let baseUrl = '@/components/settingManagement/';
const content = require.context('../components/settingManagement/', true, /\.vue$/);
content.keys().forEach(e => {
const path = e.substring(e.indexOf('/'), e.lastIndexOf('.'));
const text = e.substring(e.lastIndexOf('/') + 1);
const name = `${text.replace('.vue', '')}`;
//额外信息,写到一个同名js文件里,动态引入
let external = require(`@/components/settingManagement/${name}.js`);
let routeObj = {
path: path,
name: name,
// 避坑,动态导入静态资源时一定不要把整个路径当成变量
component: () => import(`@/components/settingManagement/${text}`),
// 额外信息填充
meta: external.default
};
routeArr.push(routeObj);
});
export default routeArr;
额外补充信息js文件,与vue文件同目录,同名
const obj = { title: '示例页面标题' };
export default obj;
使用自动生成的路由
import routeArr from './autoRouter';
const router = new VueRouter({
...routeArr
});