warning in ./node_modules/vue-router/dist/vue-router.esm-bundler.js

最新推荐文章于 2024-08-21 10:43:34 发布
原创 最新推荐文章于 2024-08-21 10:43:34 发布 · 4.5k 阅读 · 12 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#vue.js #javascript #前端

在尝试使用vuecli创建Vue2项目并安装vue-router后，遇到浏览器控制台报错，原因是vue-router版本过高与Vue2不兼容。解决方法是卸载vue-router的4.x版本，然后通过@指定版本安装vue-router 3.5.2。执行`npm uninstall vue-router`后，使用`npm install vue-router@3.5.2`安装指定版本，问题得到解决。

问题
利用vue cli 新建vue2项目,安装vue-router后浏览器控制台报错:

在这里插入图片描述
问题所在和解决

:vue-router版本太高和vue2起冲突了,虽然router4.X的大部分的 Vue Router API 都没有变化,但vue-router 3.x 只能结合 vue2 进行使用~(网上查的说法,我翻了下router官方文档没找到这样的

解决也很简单：**卸载4版本的router,@指定版本装3.x的vue-router即可，我按自己的习惯安装3.5.2的vue-router亲测可用~**命令如下

npm uninstall vue-router
npm i vue-router@3.5.2
warning in .node_modulesvue-routerdistvue-router.esm-bundler.js “export ‘watchEffect‘ was not
m0_54849873的博客
03-06 725
问题 利用vue cli 新建vue2项目,安装vue-router后浏览器控制台报错: Uncaught TypeError: Object(…) is not a function 终端这边爆 warning in ./node_modules/vue-router/dist/vue-router.esm-bundler.js "export ‘watchEffect’ was not 问题所在和解决 **本人版本:@vue/cli 4.5.15 ** 创建的是vue2项目 确定是vue-ro
ERROR in ./node_modules/vue-router/dist/vue-router.mjs
m0_52477297的博客
10-16 1834
卸载4版本的router,@指定版本装3.x的vue-router即可，我按自己的习惯安装3.5.2的vue-router亲测可用。安装vue-router时没有指定版本,然后npm自动下的是最新版（vue-router版本太高和vue2起冲突了）卸载：npm uninstall vue-router。今天打算新建一个项目，在下载完路由的时候发现报错了。安装：npm i vue-router@3.5.2。在package.json中找到。重新启动一下项目就恢复如初啦。
关于Vue脚手架用router报错==》in ./node_modules/_vue-router@4.0.14@vue-router/dist/vue-router.esm-bundler.js
zsjwbxh的博客
04-24 3989
关于Vue问题：in ./node_modules/_vue-router@4.0.14@vue-router/dist/vue-router.esm-bundler.js
vue-router警告warning in ./node_modules/vue-router/dist/vue-router.esm-bundler.js报错Object(…) is not a
weixin_53515924的博客
02-10 909
报错： 利用vue cli 新建前端项目,安装vue-router后浏览器控制台报错:Uncaught TypeError: Object(…) is not a function等一系列错误 终端报的警告如下（17个）： 原因： vue-router版本太高有些地方改了,具体原因我不清楚 ...
error in ./node_modules/vue-router/dist/vue-router.mjs“export ‘computed‘ was not found in ‘vue‘
m0_60769905的博客
07-31 734
卸载4版本的router 安装指定版本的vue-router即可，可以安装3.5.2 的vue-router（亲测可用 ）npm自动下载vue-router时下载的是最新版（vue-router版本太高和vue2起冲突了）卸载命令：npm uninstall vue-router。安装命令：npm i vue-router@3.5.2。在package.json中找到。最后重新启动项目即可。
项目启动报错 [vite] [plugin:vite:import-analysis] Cannot find module 'vue-router/dist/vue-router.esm-bundler.js' Require stack: - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/resolve.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/hbx/env.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/hbx/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/utils.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/mp/ast.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/mp/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/vite-plugin-uni/dist/cli/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/vite-plugin-uni/bin/uni.js at ../node_modules/@dcloudio/uni-h5/dist/uni-h5.es.js:1:0 下午11:18:47 [vite] [plugin:vite:import-analysis] Cannot find module 'vue-router/dist/vue-router.esm-bundler.js' Require stack: - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/resolve.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/hbx/env.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/hbx/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/utils.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/mp/ast.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/mp/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/vite-plugin-uni/dist/cli/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/vite-plugin-uni/bin/uni.js at ../node_modules/@dcloudio/uni-h5/dist/uni-h5.es.js:1:0 (x2) 下午11:18:47 [vite] [plugin:vite:import-analysis] Cannot find module 'vue-router/dist/vue-router.esm-bundler.js' Require stack: - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/resolve.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/hbx/env.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/hbx/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/utils.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/mp/ast.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/mp/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/vite-plugin-uni/dist/cli/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/vite-plugin-uni/bin/uni.js at ../node_modules/@dcloudio/uni-h5/dist/uni-h5.es.js:1:0 (x3) 下午11:18:47 [vite] [plugin:vite:import-analysis] Cannot find module 'vue-router/dist/vue-router.esm-bundler.js' Require stack: - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/resolve.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/hbx/env.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/hbx/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/utils.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/mp/ast.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/mp/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/vite-plugin-uni/dist/cli/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/vite-plugin-uni/bin/uni.js at ../node_modules/@dcloudio/uni-h5/dist/uni-h5.es.js:1:0 (x4) 下午11:18:47 [vite] [plugin:vite:import-analysis] Cannot find module 'vue-router/dist/vue-router.esm-bundler.js' Require stack: - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/resolve.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/hbx/env.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/hbx/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/utils.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/mp/ast.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/mp/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/uni-cli-shared/dist/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/vite-plugin-uni/dist/cli/index.js - /Users/di/Desktop/uni-preset-vue-vite/node_modules/@dcloudio/vite-plugin-uni/bin/uni.js at ../node_modules/@dcloudio/uni-h5/dist/uni-h5.es.js:1:0 (x5)
最新发布
10-30
然后，检查node_modules/vue-router/dist目录下是否存在文件vue-router.esm-bundler.js。 如果不存在，可能需要重新安装： ```bash npm install vue-router@latest ``` 步骤2：配置vite.config.js中的别名 ...
[plugin:vite:import-analysis] Cannot find module 'vue-router/dist/vue-router.esm-bundler.js' Require stack: - /Users/di/myProjects/xingzi/xingzitech-h5/node_modules/@dcloudio/uni-cli-shared/dist/resolve.js - /Users/di/myProjects/xingzi/xingzitech-h5/node_modules/@dcloudio/uni-cli-shared/dist/hbx/env.js - /Users/di/myProjects/xingzi/xingzitech-h5/node_modules/@dcloudio/uni-cli-shared/dist/hbx/index.js - /Users/di/myProjects/xingzi/xingzitech-h5/node_modules/@dcloudio/uni-cli-shared/dist/utils.js - /Users/di/myProjects/xingzi/xingzitech-h5/node_modules/@dcloudio/uni-cli-shared/dist/mp/ast.js - /Users/di/myProjects/xingzi/xingzitech-h5/node_modules/@dcloudio/uni-cli-shared/dist/mp/index.js - /Users/di/myProjects/xingzi/xingzitech-h5/node_modules/@dcloudio/uni-cli-shared/dist/index.js - /Users/di/myProjects/xingzi/xingzitech-h5/node_modules/@dcloudio/vite-plugin-uni/dist/cli/index.js - /Users/di/myProjects/xingzi/xingzitech-h5/node_modules/@dcloudio/vite-plugin-uni/bin/uni.js /Users/di/myProjects/xingzi/xingzitech-h5/node_modules/@dcloudio/uni-h5/dist/uni-h5.es.js
10-30
确保node_modules/vue-router/dist/vue-router.esm-bundler.js文件确实存在。如果不存在，可能是安装问题，可以尝试重新安装依赖： ```bash npm install vue-router@latest # 或者 yarn add vue-router@latest ...
Cannot read properties of null (reading 'component') TypeError: Cannot read properties of null (reading 'component') at locateNonHydratedAsyncRoot (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:5651:41) at locateNonHydratedAsyncRoot (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:5656:14) at ReactiveEffect.componentUpdateFn [as fn] (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:5005:40) at ReactiveEffect.run (webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:323:19) at eval (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:698:25) at callWithErrorHandling (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:385:33) at flushJobs (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:586:9)
07-30
component: () => import('../views/user/User.vue') } ``` 如果路径错误、组件未导出、或构建工具配置错误，可能导致组件为 `null`。 --- ### 3. **组件未正确导出（忘记 `export default`）** ```vue <!-- ...
Vue 3 应用成功挂载到 #admin-pro routes.js:116 【加载路由】finallyRoutes: (3) [{…}, {…}, {…}] routes.js:118 【路由加载完成】 vue-router.mjs:77 [Vue Router warn]: No match found for location with path "/index" warn @ vue-router.mjs:77 resolve @ vue-router.mjs:3180 pushWithRedirect @ vue-router.mjs:3314 push @ vue-router.mjs:3279 eval @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader-v16/dist/index.js?!./src/views/login/index.vue?vue&type=script&lang=js:76 await in eval validateField @ form2.mjs:116 await in validateField validate @ form2.mjs:86 handleSuccess @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader-v16/dist/index.js?!./src/views/login/index.vue?vue&type=script&lang=js:64 callWithErrorHandling @ runtime-core.esm-bundler.js:386 callWithAsyncErrorHandling @ runtime-core.esm-bundler.js:393 emit @ runtime-core.esm-bundler.js:6596 eval @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader-v16/dist/index.js?!./src/extra/zx-verify-code/index.vue?vue&type=script&lang=js:182了解此警告 index.js:466 Navigating to: /index
07-25
你已经成功将 Vue 3 应用挂载到 `#admin-pro`，并且在 Vuex 的 `setRoutes` 中打印了 `finallyRoutes`，也确认了路由已经通过 `resetRouter()` 加载完成，但在跳转 `/index` 时仍然出现如下警告： ``` [Vue Router ...
vue-router报错: uncaught error during route navigation
qq_44535402的博客
02-21 8547
"[vue-router] uncaught error during route navigation:" Failed to resolve async component default: ChunkLoadError: "Uncaught (in promise) " {name: "ChunkLoadError", message: {message: "Loading chunk src_components_
[vue-router] uncaught error during route navigation
胡聊前端的博客
02-05 3万+
vue路由在加载组件之前会执行一些逻辑，尤其是生命周期的钩子函数 如果你在以上的钩子函数中，写了自己的逻辑，并报错了。就会触发[vue-router] uncaught error during route navigation这个错误。 原因是vue进行了try catch，会捕获到代码执行过程中的错误。 所以检查一下你的控制台有没有报错。先解决报红的错误，然后这个警告就自己消失了。 ...
[Vue Router warn]: Finding ancestor route “/:path(.*)*“ failed for “/:path(.*)*“
2302_76925238的博客
08-21 1584
名称必须是唯一的name。
Vue Router warn The “next“ callback was called more than once in one navigation guard
weixin_43814775的博客
01-10 2万+
问题： 问题代码： router.beforeEach(async (to, from, next) => { const token = Cookies.get('token'); next(); if (to.path === '/login' || to.path === '/') { next(); } else { if (token) { next(); } else {
vue访问嵌套路由警告[Vue Router warn]: No match found for location with path““
J14N的博客
05-31 554
访问嵌套路由警告：[Vue Router warn]: No match found for location with path""并且白屏不显示任何内容。
Vue错误日记 ——关于Vue-Router出现esm-bundler.js?6c02:2127 Uncaught TypeError: Object(...) is no的解决方案
Marinda_Speed的博客
05-15 3002
Vue错误日记 ——关于Vue-Router无法正常使用的解决方案前言配置项目环境项目代码问题处理结束语 前言 今天用 Vue-cli 搭建 Vue 项目时，发现Router无法正常挂载，不是无法new出来，或者是抛出 vue-router.esm-bundler.js?6c02:2127 Uncaught TypeError: Object(…) is not a等错误！ 本篇文章讲述关于Vue-cli下怎么配置VueRouter 配置 项目环境 项目代码 main.js import Vue fr
解决Vue3.0 页面刷新 [Vue Router warn]: No match found for location with path 警告
热门推荐
283301717的博客
08-23 4万+
解决 vue 刷新浏览器 [Vue Router warn]: No match found for location with path 警告
vue报错vue-router.esm.js?8c4f:2062 Uncaught (in promise) Error: Avoided redundant navigation to curren
xiaonan12386的博客
07-07 4047
在写导航切换时点击会有以下报错 这个报错是是路由中点击路径重复 ，也有可能是安装的vue-router还是之前出错的那个版本，在项目目录下运行 npm i vue-router@3.0 -S 即可。 解决方法1：在 main.js里添加一段代码。 代码如下： import Router from 'vue-router' const routerPush = Router.prototype.push Router.prototype.push = function push(location) {
[Vue Router warn]
m0_49471668的博客
04-20 1509
[Vue Router warn]: <router-view> can no longer be used directly inside <transition> or <keep-alive>. Use slot props instead: 就是vue-router不再使用原来的写法，用slot插槽代替 原因： 检查vue-router的版本一般是4.x以上的都改用了新的写法 解决： 改成 <router-view v-slot="{ Com.
解决vue路由守卫报错信息
m0_57479235的博客
05-25 5379
//在router文件中写入，修改报错信息 const originalPush = VueRouter.prototype.push VueRouter.prototype.push = function push(location, onResolve, onReject) { if (onResolve || onReject) { return originalPush.call(this, location, onResolve, onReject) } return ori.
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

你的美，让我痴迷

你的好，我会永远记住你的。

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值