vue vite自动化路由 无需手动配置

vue vite自动化路由

测试某些功能或者框架以及库的时候 需要创建新vue页面 没次都有手动配置
仅仅测试 细化的话根据自己需求配置权限 这里方便点 直接把router文件删掉 直接在main.js 引入所有路由注册
这样 每次在views下创建一个vue文件 直接访即可 不用手动注册了

main.js

js 复制代码
import { createApp } from 'vue';
import App from './App.vue';
import { createRouter, createWebHistory } from 'vue-router';

const views = import.meta.glob('./views/**/index.vue');

const routes = Object.keys(views).map((path) => {
    const name = path.match(/\.\/views\/(.*)\/index\.vue$/)[1];
    return {
        path: `/${name}`,
        name,
        component: views[path],
    };
});

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

const app = createApp(App);
app.use(router);
app.mount('#app');
相关推荐
鸽芷咕13 分钟前
DrissionPage 成 CANN 仓库爆款自动化工具:背后原因何在?
运维·python·自动化·cann
池央14 分钟前
CANN GE 深度解析:图编译器的核心优化策略、执行流调度与模型下沉技术原理
人工智能·ci/cd·自动化
深圳安锐科技有限公司30 分钟前
斜拉桥、铁塔 4G 一体化索力计 工地快速加装方案怎么实施?
自动化·实时监测·自动化监测·桥梁监测·结构健康监测·索力计·索力监测仪
WooaiJava34 分钟前
AI 智能助手项目面试技术要点总结(前端部分)
javascript·大模型·html5
LYFlied38 分钟前
从 Vue 到 React,再到 React Native:资深前端开发者的平滑过渡指南
vue.js·react native·react.js
爱喝白开水a1 小时前
前端AI自动化测试:brower-use调研让大模型帮你做网页交互与测试
前端·人工智能·大模型·prompt·交互·agent·rag
Never_Satisfied1 小时前
在JavaScript / HTML中,关于querySelectorAll方法
开发语言·javascript·html
董世昌411 小时前
深度解析ES6 Set与Map:相同点、核心差异及实战选型
前端·javascript·es6
B站_计算机毕业设计之家1 小时前
豆瓣电影数据采集分析推荐系统 | Python Vue Flask框架 LSTM Echarts多技术融合开发 毕业设计源码 计算机
vue.js·python·机器学习·flask·echarts·lstm·推荐算法
北京耐用通信1 小时前
破解AGV多协议互联难题:耐达讯自动化Profinet转Devicenet网关如何实现高效协同
人工智能·科技·物联网·网络协议·自动化·信息与通信