Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'app')
We develop a Vue app, which is provided as a web component for production usage. The component is integrated in a tab layout, the web component is instantiated when the tab is opened, the web component is disconnected when the tab is closed and the Vue app is also unmounted in this context. When a tab containing the web components is closed for the first time, the following error occurs. When reopening a tab that contains the web component, the error always occurs from now on. The communication between the web component and the tab layout no longer works, the functionality is no longer fully available. The Vue app in the web component itself is still functional. The Dev Tools are not part of the (prod) build, they are installed as a browser extension. If the dev tools are deactivated in the browser, the error no longer occurs and everything works as expected.
prepare.js:1 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'app')
at Object.get (prepare.js:1:41156)
at prepare.js:1:70195
at prepare.js:1:33620
at prepare.js:1:33612
which leads to
, I = new Proxy(u.__VUE_DEVTOOLS_KIT_ACTIVE_APP_RECORD__,{
get(t, e, o) {
return e === "value" ? u.__VUE_DEVTOOLS_KIT_ACTIVE_APP_RECORD__ : e === "id" ? u.__VUE_DEVTOOLS_KIT_ACTIVE_APP_RECORD_ID__ : u.__VUE_DEVTOOLS_KIT_ACTIVE_APP_RECORD__[e]
}
...
e seems to be undefined.
Browser: Chrome Version: 137.0.7151.120 Vue Dev Tools: 7.7.7
Hi, I think this might be related to a discussion I opened here. Are you actually "mixing" up production code with development code in the above scenario? If so, may also be related to this issue.
刚开始我卸载pnpm uninstall vite-plugin-vue-devtools 没效果还是报错, 但我卸载浏览器插件 vue devtool 就没报错了,应该是浏览器插件的 bug
At first, I uninstalled pnpm uninstall vite-plugin-vue-devtools, but it didn't work and still showed an error. However, after uninstalling the browser plugin Vue DevTools, the error was gone. It seems to be a bug in the browser plugin.