【vue3】vue3+vite动态导入路由出现The above dynamic import cannot be analyzed by Vite
解决流程
原本代码
export const loadView = (view:string) => {return () => import(`@/views/${view}`)
}
vite发出警告:
The above dynamic import cannot be analyzed by Vite
vite官方文档说，需要使用Glob 导入形式
https://cn.vitejs.dev/guide/features.html#glob-import
使用glob导入实例
//这里的路径需要根据你的项目路径来修改
const modules = import.meta.glob('@/views/*/*.vue')
export const loadView = (view:string) => {return modules[`@/views/${view}`]
}
✨踩坑不易，还希望各位大佬支持一下\textcolor{gray}{踩坑不易，还希望各位大佬支持一下}踩坑不易，还希望各位大佬支持一下
【vue3】vue3+vite动态导入路由出现The above dynamic import cannot be analyzed by Vite相关推荐
- 踩坑记15 动态路由 router.options.routes未更新 | vue升级 element-plus未适配vue3.2.x | vite glob导入动态加载组件，不能使用别名alias
2021.8.12 坑50(vue-router4.addRoute().router.options.routes未更新):进行动态权限获取菜单的设置,使用了addRoute()来添加路由,但是ro ...
- 13 代码分割之import静动态导入
前端首屏优化方案之一 项目构建时会整体打包成一个bundle的JS文件,而有的代码.模块是加载时不需要的,需要分割出来单独形成一个文件块chunk(不会打包在main里),让模块懒加载(想加载时才加载 ...
- 使用addRoutes动态添加路由
登录是获取添加的路由,存在vuex中 login.vue import {initRoutes} from "@/router/index.js"; // 按需引入路由的动态注入方 ...
- vue3动态添加路由
文章目录 前言 一.初始化项目 二.添加"vip"路由 三.总结 前言 有的时候我们需要根据不同的用户身份生成不同的路由规则,例如: vip用户应该有自己的vip页面所对应的专用路 ...
- 如何利用Vue3管理系统实现动态路由和动态侧边菜单栏
前言 在做Vue管理系统的时候,都会遇到的一个需求:每个用户的权限是不一样的,那么他可以访问的页面(路由),可以操作的菜单选项是不一样的,如果由后端控制,我们前端需要去实现动态路由,动态渲染侧边菜单栏 ...
- Vue3 Element Plus 动态图标
Vue3 Element Plus 动态图标 Element Plus 中的图标以组件的形式来使用,而在基于Vue 2.x的Element UI中图标是字符串的形式,这样就导致过去的一些使用习惯不得不 ...
- vue3加载动态图片
vue3加载动态图片 一.动态加载图片 使用new URL(url, import.meta.url) <template><div class="home"&g ...
- vue mixins（vue3 hooks）动态获取div高度
之前转载过一篇文章: https://blog.csdn.net/qq_37167049/article/details/103084927 可以动态计算div 高度,但是比较繁琐的痛点是: 需要在每 ...
- vue2.0 + router 3. 0 动态添加路由
3月11日 周五 作日回顾 .动态添加路由 实现语句 vue 2.0使用 this.$router.addRoutes(); this.$router.addRoutes(currRoutes);// ...
最新文章
- AI攻击AI，升级的网络安全战
- PIE SDK与IDL算法结合说明文档
- python array笔记
- 【SeeMusic】视频编辑 ( 视频 X 坐标 | 视频 Y 坐标 | 视频旋转 | 视频扭曲 )
- python 嵌入键值数据库_PupDB 一个用Python编写基于文件的简单键值数据库
- VS 2005 WEB PROJECT包括Crystal Report水晶报表的发布
- 2021-04-04 CPU缓存一致性 MESI协议
- 正则双重过滤 /// splitKey1 第一个正则式匹配 /// splitKey2 匹配结果中再次匹配进行替...
- HTML5基本知识小测验
- 微软推出Windows Sandbox：可安全运行任何应用的一次性VM\n
- 面向对象（Python）：学习笔记之私有属性和私有方法
- android勾选控件_【Android 开发】：UI控件之复选框控件 CheckBox 的使用方法
- 《圈圈教你玩USB》 第七章 USB MIDI键盘 看书笔记
- 升级版DC/DC转换器有什么优点？
- Unity TextMeshPro 制作字体用简体中文字符集 （仅用于开发）
- Windows 11 修改Edge按 Alt+Tab 键为单个窗口
- 夸奖对方代码写的好_形容夸人的成语有哪些
- 神经网络反向传播BP算法代码实现
- 监督学习、无监督学习、半监督学习和强化学习
- Python初学者：元组数据操作，输出元组内7的倍数以及个位是7的数
热门文章