Vue项目一个报错无法找到原因?

Question

各位麻烦看看是否遇到过这样的报错：

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'Vue')
    at initBackend (backend.js:2119:28)

排查了好久实在没有找到哪儿出了问题，时不时弹出来，编译结果又是正常的，尝试排查了好久但是一直没有办法排查出来，有遇到过这种报错的同学吗？或者有没有同学提供一种排查思路，因为我真的搞懵逼了。哈哈哈。

另外，Vue devtools经常崩溃卡顿，数据不会自动更新什么的，有什么办法处理不？有没有替代办法？

Answer 1

猜测是有一个地方动态调用，比如 switch(type) case 1: 'on'; case 2 : 'off' 之类的，然后去调用 Vue 上对应的函数。但是某些条件下运算结果是 undefined，于是就出现你的这个问题了。

这里就告诉我们，别整那么动态，不然到时候出问题都没法 debug。

至于解法嘛，

1. 先看 backend.js 2119 行 28 到底是是个啥
2. 如果不是第三方库导致的，就在你的代码里搜索 Vue[ 试试看
3. 如果都不行，把 backend.js 拆开，缩小问题范围

Answer 2

就是那个浏览器插件的报错。

Answer 3

报错行的代码可以贴上来看一下吗？

Answer 4

用户Bai2001说的没错，就是那个控制台的vue devtool 插件的问题，不是你代码问题。
同样的在stackoverflow也有人和你有着同样的问题，也是这个backend.js问题
参考链接：https://stackoverflow.com/questions/78697622/cannot-read-properties-of-undefined-reading-vue-at-initbackend-how-can-i-so
并且我也出现了这个问题，但是我把插件卸载后，就没有出现过这个问题了。
然后，现在我采用的是在vite创建VUE3项目时所选择的一个vueDevTool插件

Answer 5

这个错误信息 "Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'Vue')" 表示在你试图使用 Vue 对象的时候，它是未定义的。通常，这是由于 Vue.js 没有正确导入或在你使用它的地方不可用导致的。

以下是一些步骤来帮助你排查和解决这个问题：

1. 检查 Vue.js 导入
   确保在你的项目中正确导入了 Vue.js。根据你的项目设置，你应该有类似以下的代码：

使用模块化导入
如果你使用的是模块化系统（例如通过 Webpack 或 Vite 构建），你应该确保在需要使用 Vue 的地方导入它：

javascript
复制代码
import Vue from 'vue';
使用 CDN
如果你使用的是 CDN，请确保在 HTML 文件中正确引用了 Vue.js：

html
复制代码
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>

2. 检查 Vue.js 的版本
   确保你使用的 Vue.js 版本与你的项目和依赖项兼容。不同版本的 Vue.js 可能会有不同的导入和使用方式。
3. 确认 Vue.js 加载顺序
   如果你在使用 Vue DevTools 或其他第三方库，确保它们是在 Vue.js 之后加载的。加载顺序不正确可能导致 Vue 对象未定义的问题。
4. 确认 Vue 实例的创建
   确保在正确的地方创建了 Vue 实例。比如：

javascript
复制代码
new Vue({
el: '#app',
render: h => h(App),
});
示例修复代码
假设你使用 Webpack 或 Vite 构建项目，可以参考以下代码片段：

javascript
复制代码
// main.js
import Vue from 'vue';
import App from './App.vue';

new Vue({
render: h => h(App),
}).$mount('#app');
进一步调试
如果以上步骤没有解决问题，可以通过以下方法进一步调试：

确认 Vue.js 文件是否正确加载（检查浏览器控制台的网络请求）。
使用 console.log(Vue) 检查 Vue 对象在代码中的定义状态。
如果问题依然存在，请提供更多的代码和项目结构信息，这样我可以更具体地帮助你解决问题。