vue3 vite 路由去中心化(modules文件夹自动导入router)

通过路由去中心化可实现多人写作开发,不怕文件不停修改导致的冲突,modules中的文件可自动导入到index.js中
在这里插入图片描述

// 自动导入模块
const files = import.meta.globEager('./modules/**.js');
const modules = {}
for (const key in files) {
 modules[key.replace(/(\.\/modules\/|\.js)/g, '')] = files[key].default
}
Object.keys(modules).forEach(item => {
 routes.push(...modules[item]);
})

// 路由router/index.js
import { createRouter, createWebHistory } from "vue-router";
import { forLogin } from "@/utils/forLoign";
import Index from "@/layout/Index.vue";
import IndexNoMenus from "@/layout/IndexNoMenus.vue";

const routes = [
  {
    path: "/index",
    name: "index",
    redirect: "/",
    component: Index,
    meta: {
      auth: true,
      keepAlive: false,
      title: "",
    },
    children: [
      {
        path: "/",
        name: "home",
        component: () => import("@/views/home.vue"),
        meta: {
          auth: true,
          keepAlive: false,
          title: "首页",
        },
      }
    ],
  },
  {
    path: "/",
    name: "IndexNoMenus",
    redirect: "/",
    component: IndexNoMenus,
    meta: {
      auth: true,
      keepAlive: false,
      title: "",
    },
    children: [],
  },
  {
    path: "/login",
    name: "login",
    component: () => import("@/views/login.vue"),
    meta: {
      auth: false,
      keepAlive: false,
      title: "登录",
    },
  },
  {
    path: "/404",
    name: "not-found",
    component: () => import("@/views/404.vue"),
    meta: {
      auth: false,
      keepAlive: false,
      title: "not-found",
    },
  },
  {
    path: "/:pathMatch(.*)*",
    redirect: "/404",
    meta: {
      auth: false,
      keepAlive: false,
      title: "not-found",
    },
  },
];

// 自动导入模块
const files = import.meta.globEager('./modules/**.js');
const modules = {}
for (const key in files) {
    modules[key.replace(/(\.\/modules\/|\.js)/g, '')] = files[key].default
}
Object.keys(modules).forEach(item => {
  routes.push(...modules[item]);
})

// console.log('modules', files, modules, routes);

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

// 登录拦截跳转
router.beforeEach((to, from, next) => {
  // * console.log(to)
  forLogin(to, from, next);
});

export default router;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/588329.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【C语言加油站】字符函数与字符串函数

字符函数与字符串函数 导言一、字符分类函数1.1 字符分类函数的用法 二、字符转换函数2.1 字符转换函数的用法 三、字符串函数3.1 成员3.2 strlen函数3.2.1 size_t类型3.2.2 strlen的易错点3.2.2 strlen的使用3.2.3 strlen与sizeof 3.3 strcpy函数和strncpy函数3.3.1 strcpy和s…

Messari 报告摘要 :Covalent Network(CQT)2024 年第一季度表现

摘要: 尽管 CQT 代币流通供应量增加了 20%(新增 1.04 亿枚 CQT),但 CQT 的质押百分比仅从 2023 年第一季度的 22% 增长到了 2024 年第一季度的 29%。 CQT 的市值季度环比增长了 28%,多次达到 2.75 亿美元&#xff0c…

脑筋急转弯在线问答

页面效果 点击“显示答案”按钮&#xff0c;显示参考答案。 页面代码 <% layout(/layouts/default.html, {title: 脑筋急转弯管理, libs: [dataGrid]}){ %> <div class"main-content"><div class"box box-main"><div class"bo…

【介绍下大数据组件之Storm】

&#x1f3a5;博主&#xff1a;程序员不想YY啊 &#x1f4ab;CSDN优质创作者&#xff0c;CSDN实力新星&#xff0c;CSDN博客专家 &#x1f917;点赞&#x1f388;收藏⭐再看&#x1f4ab;养成习惯 ✨希望本文对您有所裨益&#xff0c;如有不足之处&#xff0c;欢迎在评论区提出…

【Java】 对象的比较【比较器】

登神长阶 第七阶 Java对象的比较 &#x1f3b7;一.Java对象的比较 &#x1fa97;1.基于引用的比较 基于引用的比较在Java中使用运算符进行。它主要检查两个对象是否引用内存中的相同位置。以下是基于引用的比较的详细介绍&#xff1a; 使用运算符&#xff1a; 运算符用于比…

【Qt QML】Frame组件

Frame&#xff08;框架&#xff09;包含在&#xff1a; import QtQuick.Controls继承自Pane控件。用于在可视框架内布局一组逻辑控件。简单来说就是用来包裹和突出显示其他可视元素。Frame不提供自己的布局&#xff0c;但需要自己对元素位置进行设置和定位&#xff0c;例如通过…

vue3与js的router基本使用方式

title: vue3与js的router基本使用方式 tags: vue3js abbrlink: ‘57270957’ date: 2024-04-17 18:54:47 第一步快捷引入的别名 使用路由需要大量在src文件中引用所需要的地址&#xff0c;并且组件中也需要很多的包的引用&#xff0c;将快速跳转到src这一文件的步骤进行简化操…

如何从 iPhone 恢复已删除或丢失的联系人?

不小心删除了您的 iPhone 联系人&#xff1f;不用担心。我们将向您展示如何从 iPhone或 iPad恢复已删除或丢失的联系人。当您从 iPhone 中删除联系人时&#xff0c;您可能认为无法将其恢复。但事实是&#xff0c;您可以从 iPhone 或 iPad 恢复已删除的联系人&#xff0c;因为它…

模型智能体开发之metagpt-多智能体实践

参考&#xff1a; metagpt环境配置参考模型智能体开发之metagpt-单智能体实践 需求分析 之前有过单智能体的测试case&#xff0c;但是现实生活场景是很复杂的&#xff0c;所以单智能体远远不能满足我们的诉求&#xff0c;所以仍然还需要了解多智能体的实现。通过多个role对动…

手撕spring框架(3)

手撕spring框架&#xff08;3&#xff09; 相关系列 手撕spring框架&#xff08;1&#xff09; 手撕spring框架&#xff08;2&#xff09; InitializingBean 接口详解 什么是 InitializingBean 接口&#xff1f; InitializingBean 接口是 Spring 框架中的一个接口&#xff0c…

【linux】进程(深入理解linux进程状态)

开始之前先说一个与本文无关的小知识&#xff0c;chdir命令可以更改当前进程的工作目录哦。 目录 linux具体进程状态&#xff1a;R && S&#xff1a;T && t&#xff1a;D&#xff1a;僵尸进程 && 孤儿进程&#xff1a; OS的理论线&#xff1a;运行&…

模型训练中的过拟合和欠拟合

基本概念 我们知道&#xff0c;所谓的神经网络其实就是一个复杂的非线性函数&#xff0c;网络越深&#xff0c;这个函数就越复杂&#xff0c;相应的表达能力也就越强&#xff0c;神经网络的训练则是一个拟合的过程。   当模型的复杂度小于真实数据的复杂度&#xff0c;模型表…

正版Office-Word使用时却提示无网络连接请检查你的网络设置 然后重试

这是购买电脑时自带的已经安装好的word。看纸箱外壳有office标记&#xff0c;但是好像没有印系列号。 某天要使用。提示&#xff1a;无网络连接请检查你的网络设置。 经过网上高手的提示&#xff1a; 说要勾选勾选ssl3.0、TLS1.0、1.1、1.2。 我的截图 我电脑进去就缺1.2. …

2024五一数学建模A题思路代码与论文分析

2024五一数学建模A题完整代码和成品论文获取↓↓↓↓↓ https://www.yuque.com/u42168770/qv6z0d/gyoz9ou5upvkv6nx?singleDoc# 2024五一数学建模A题钢板最优切割路径问题需要建立的模型和算法: 图论 最短路径算法(Dijkstra算法、Floyd算法等) 动态规划 网格化离散建模 …

Surya:强大的开源 OCR 文字识别工具

在当今数字化时代&#xff0c;文字识别技术扮演着至关重要的角色。VikParuchuri/surya 便是一款令人瞩目的开源 OCR 文字识别工具。 主要功能&#xff1a; 支持 90 多种语言的文字识别&#xff1a;Surya 具备强大的语言兼容性&#xff0c;能够轻松应对多种语言的文字识别任务&…

保存钉钉群直播回放下载:直播回放下载步骤详解

今天&#xff0c;我们就来拨开云雾&#xff0c;揭开保存钉钉群直播回放的神秘面纱。教会你们如何下载钉钉群直播回放 首先用到的工具我全部打包好了&#xff0c;有需要的自己下载一下 钉钉群直播回放工具下载&#xff1a;https://pan.baidu.com/s/1WVMNGoKcTwR_NDpvFP2O2A?p…

基于EBAZ4205矿板的图像处理:03摄像头采集HDMI输出视频图像

基于EBAZ4205矿板的图像处理&#xff1a;03摄像头采集HDMI输出视频图像 先看效果 项目简介 我是使用的EBAZ4205矿板&#xff0c;超级大电工的转接板和我自己买的一块没有xclk的ov5640完成的该项目&#xff0c;没有设备需自备。我就是跑通了正点原子的开源代码&#xff08;下文…

1991-2022年上市公司短贷长投/短债长用/投融资期限错配(包含原始数据及Stata代码)

01、数据简介 上市公司在投融资过程中&#xff0c;可能会涉及到投融资期限错配、短债长用和短贷长投等问题 投融资期限错配是指企业的资产与债务期限不匹配&#xff0c;主要表现为“短存长贷”&#xff0c;即资金来源短期化、资金运用长期化。当风险缓释的期限比当前的风险暴…

Elasticsearch:理解近似最近邻 (ANN) 算法

作者&#xff1a;来自 Elastic Elastic Platform Team 如果你是在互联网出现之前长大的&#xff0c;你会记得找到新喜好并不总是那么容易。我们是在无意中听到收音机里的新乐队时发现他们的&#xff0c;是因为忘了换频道偶然看到一个新电视节目的&#xff0c;也是几乎完全依据游…

本地搭建llama大模型及对话UI

环境说明&#xff1a;MBP 2023 M2Pro芯片 用到的工具/组件/技术&#xff1a;ollama、llama3:8b、docker、open-webui 1.下载ollama ollama官网下载地址&#xff1a;https://ollama.com/download 到ollama官网地址下载对应操作系统版本的ollama平台&#xff0c;按照安装指引…
最新文章