vite中约定大于配置

前言

在路由配置中,根据目录结构进行配置路由.

正文代码

//首先确保目录结构符合规范
//         ../views/about/index.vue
//在about中添加一个文件page.js 

//每个文件夹的page.js 填写
export default{
title:'关于我',
menOrder:3,
};

//route.js
import {createRouter,createWebHistory} from 'vue-router';

const pages=import.meta.glob('../views/**/page.js',{
    eager:true,
import :'default',
});
const comps=import.meta,glob('../views/**/index.vue')

const routes = Object.entries(pages).map(([path,page])=>{
const comPath=path.replace('page.js','index.vue');
path=path.replace('../views','').replace('/page.js','') || '/'
const name=path:split('/').filter(Boolean).join('-') || 'index'
return {
    path,
    name,
    component:()=>comps[compPath],
    meta:{
        title:'首页',
        menuOrder:1,
        },
 }
})

export const router=createRouter({
history:createWebHistory(),
routes,
})