vue-element-admin，动态路由报Error: Cannot find module ‘@/views/teacher/teacher-list’ at webpackEmptyConte

最新推荐文章于 2024-06-19 20:53:45 发布
最新推荐文章于 2024-06-19 20:53:45 发布
阅读量1k 收藏
点赞数
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_49080170/article/details/127344382
版权

配置动态路由报

Error: Cannot find module ‘@/views/teacher/teacher-list’

at webpackEmptyContext (eval at ./src/utils sync recursive (app.js:2486)

你使用的是webpack4 或者以下版本，不能支持动态import导入，或者说是变量形式的导入。楼主不是专业前端，只能给一个大家的解决方法来实现路由的懒加载，因为楼主是在使用vue-element-admin中想实现动态加载路由时遇到此问题。 

//原写法
component:()=>import('@/views/xxxx') //这种字符串的可以
component:()=>import(`@/views/${path}`)//这种会提示Cannot find module
component:()=>resolve=>require([`@/views/${path}`],resolve) //最终写法

 

小怪兽_v
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
vue 动态加载路由时报错Error: Cannot find module ‘@/views/xxx‘ at webpackEmptyContext
bihaiyanyu的专栏
11-16 2万+
前几天写代码，写着写着，突然报了一个很奇怪的bug： 解决方法如下： 删除项目下面的label.config.js 授人以鱼不如授人以渔，以下是排查过程的思路，及排查过程尝试过的方法： 该错误是点左边菜单树的时候报错，打不开页面，开始以为是修改到了路由相关代码导致的，于是各种检查，没有发现任何异常代码。接下来发现更离谱的事情是打包发到测试环境和线上没这个问题，本地死活不行，把代码回退到之前很老的版本，还是报这个错。 接下来梳理报错前到底我做了哪些操作导致这个错误，由于公司是内外网隔离，内网
vue篇 - vue-element-admin项目，路由跳转报错Cannot read property ‘__esModule‘ of undefined
weixin_41284629的博客
01-18 2068
vue篇 - vue-element-admin项目，路由跳转报错Cannot read property ‘__esModule’ of undefined 在项目下面store/modules/permission.js文件下更改引入方式 /** * 后台查询的菜单数据拼接成路由格式的数据 * @param routes * @param data * @param is_children */ // 之前我是用的这种方式 component: item.component === '#' ? Layo
vue动态路由加载时 Cannot find module xxx 错误解决方法
热门推荐
知行合一
06-01 5万+
vue由静态路由改为动态路由时，出现下面的错误 静态路由懒加载，当我们把在router里面，把它写死在ts里时，它加载的ok的，可是我们通过api接口拉取过来的数据时，发现是不报了上面的错 // 静态路由懒加载 export const loadView = (view: any) => { return () => import(`@/views/${view}.vue`) } 错误原因是webpack打包逻辑，webpack4中动态import不支持变量方式，查看路由返回的信息，只是
若依框架 动态路由按需加载-Cannot find module问题
hfqhfq123的专栏
07-03 1689
是@vue/cli-plugin-babel/preset 引起的，要把这个babel配置去掉，并替换成其他配置。就是在打包的时候，import动态引入的文件根本没打包进去。然后就去搜了相应问题（import(`@/views/ 没有打包进去），有个博客给了答案！这样之后，终于成功了，可以看到static/js下面瞬间出现了上百个js文件。和 return () => import(所在文档，按照每个回答都去试了，都不成功。开始以为是代码及路由出了问题。后来突然灵光一闪，对比了一下，出现这个问题，看到了。
vscode使用vue动态路由功能加载组件，出现报错找不到vue模块的问题
zjm_hhxx的博客
04-11 781
解决该问题可以在vscode扩展中搜索 TypeScript Vue Plugin (Volar)进行下载，这个扩展可以解决动态路由时找不到vue模块的问题。
Vue-admin-element webpack版本问题导致 Cannot find module ‘@/views/admin/base/organization-management/index
qq_39691676的博客
08-01 876
换成： component: oldermenu.attr1 === 'Layout' ? Layout : (resolve) => require([@/views/${oldermenu.attr1}], resolve),
动态路由报Cannot find module。
玲曦的博客
05-10 3658
原由： 前端使用的是vue-element-admin框架，路由动态返回，但是我如果在后台配置了路由可能出现前台报错，我已经退出重新登陆了，并反复核对正确性，依据报Cannot find module。 解决方案： 1.如果配置没有任何问题并且和前端路由文件也能对应上，可以尝试重新运行项目。 2.查看路由的component是否注册正确，可以尝试以下方法注册。 route.component = (resolve) => require([`@/views/${component}.vue`], re
手动解决Cannot find module '@sentry/webpack-plugin'等问题
10-06
解决Cannot find module '@sentry/webpack-plugin'，Cannot find module '@sentry/browser'，Cannot find module '@sentry/cli'等问题。<br/> 下载后，解压后文件夹，放在vue项目的node_modules文件夹下，即可。
Vue安装Vue Devtools调试工具提示 Error: Cannot find module ‘@vue-devtools/build-tools’ 解决办法
01-08
我看网络上面安装Vue Devtools 调试工具的步骤几乎都是按照文章链接里的步骤进行安装：安装链接详情  但是在最终执行编译命令的时候 ：npm run build ，提示如下错误： 尝试了很多方法，都不能解决改问题。 为了...
vue3-element-admin：vue3 + element-plus + typescript 后台管理系统
05-04
vue3-element-admin 是【有来开源组织】基于 Vue3 + Vite4 + TypeScript + Element-Plus + Pinia 等前端主流技术栈从0到1搭建后台管理系统模板（前后端开源）。 后端是基于 Spring Boot 3.0 、Spring Security 6.0 ...
Cannot find module ‘xxx’，错误解决方法
01-08
vue-router.esm.js:1897 Error: Cannot find module '@/views/login/index' at webpackEmptyContext (index.js:39) at permission.js:90 解决方法 进入router中的index.js component: () => import('@/views/login/...
vue-element-admin中文版，加上匹配的node版本
09-22
vue-element-admin中文版，加上匹配的node版本 nvm ls //显示所有npm版本 nvm install 16.20.2 //安装新版本node，如果有该版本则可以不安装 nvm use 16.20.2 //设置为当前版本 npm install npm run dev //启动调试
解决Vue Router报错 Error: Cannot find module ‘@/views/xxx‘ at webpackEmptyContext
https://github.com/Bot80926
08-03 1万+
起因： 拉旧项目重跑发现运行报错，猜测是包更新导致部分写法不兼容。之后发现是原写法在webpack4中不兼容。所以这篇文章主要讲两部分： 1. 如何解决webpack4 动态编译import报错 2. imoort 和 require到底有什么区别？两者是否可以无缝替换？ 一、解决报错 // 原写法 export const loadView = (view) => { return () => import(`@/views/${view}`) } // webpack4.
Error: Cannot find module ‘@/views/xxx‘ at webpackEmptyContext
qq_30346433的博客
12-11 2091
从开源平台上面 clone 一个vue 项目时，登陆后 一直报找不到相对应的 module。 搜了很多，后面终于解决。 export const loadView = (view) => { return () => import(`@/views/${view}`) } 改成如下 export const loadView = (view) => { return (resolve) => require([`@/views/${view}`], resol
vue-element-admin 中动态路由无法显示问题
mz917520857的博客
08-31 2051
vue-element-damin 中配置中router.addRoutes() 仍然无法显示问题
vue3动态路由懒加载Error: Cannot find module ‘@/views/xxx‘ at webpackEmptyContext
mmiaoChong的博客
07-28 2184
项目场景： 最近在使用vue3+elementPlus做后台管理的权限管理，在动态添加路由懒加载出现问题 问题描述： export const loadView = view => { // 路由懒加载 return () => import(`@/views/${view}`); // 报错 // return () => require(`@/views/${view}`); // 报错 // return resolve => requi
vue 动态加载 Error: Cannot find module ‘@/views/xxx‘ at webpackEmptyContext (index.js:39)
Laputa219的博客
07-08 6260
报错： 原来写法： export const loadView = (view) => { return () => import(`@/views/${view}`) } 修改为： export const loadView = (view) => { return (resolve) => require([`@/views/${view}`], resolve) } 原因：webpack 版本问题，webpack4中动态import不支持变量方式 ...
vue+element动态路由配置踩过的坑
weixin_43743148的博客
01-29 1254
vue+element动态路由配置踩过的坑，动态路由菜单跳转不成功，刷新一直是404页面，菜单不高亮...
Vue + SpringBoot 实现文件的断点上传、秒传，存储到Minio
最新发布
m0_73179389的博客
06-19 573
前端页面使用的elment-plus的el-upload组件。当上传文件后，会调用handleChange 方法，可以在这里进行文件相关的操作。计算文件的MD5值。
Parsing error: Cannot find module vue/cli-plugin-babel/preset
10-02
Parsing error: Cannot find module 'vue/cli-plugin-babel/preset' 是因为你的项目缺少了 @vue/cli-plugin-babel 这个模块。为了解决这个问题，你可以尝试以下几个步骤： 1. 首先，删除项目中的 node_modules ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值