Cannot set properties of null (setting '__vrv_devtools') #27270

manchakkay · 2024-05-18T14:51:37Z

Environment

Operating System: Linux
Node Version: v21.7.3
Nuxt Version: 3.11.2
CLI Version: 3.11.1
Nitro Version: 2.9.6
Package Manager: pnpm@
Builder: -
User Config: modules, app, auth, devServer, server, ssr, runtimeConfig, css, vite
Runtime Modules: @sidebase/nuxt-auth@0.6.7
Build Modules: -

Reproduction

I can't share the entire project, but I'll be happy to send individual files of interest if it helps solve the problem

Describe the bug

After importing the vue-multiselect library, an error began to occur on every page of the site, this has happened dozens of times before, but the problem magically disappeared or was replaced by another more serious one (see Additional Context)

It looks like a problem with DevTools, but none of the attempts to disable it in development mode have been successful, both in terms of disabling DevTools and in terms of fixing the error.

Additional context

The problem only appears in the browser window, I tried to localize the individual file causing the problem. I can point out that the problem is not related to the /server and /pages directories and is most likely either in the dependencies or in the nuxt.config.ts configuration.

In addition to this, I also previously encountered the “isCE” (#13117) problem, which was solved through “optimizeDeps”

Actions like clearing the cache, regenerating or reinstalling previously did not help

Logs

500
Cannot set properties of null (setting '__vrv_devtools')

at https://<DOMAIN>/_nuxt/node_modules/.cache/vite/client/deps/vue-router.js?v=47f21660:1813:35
at Array.forEach ()
at Proxy. (https://<DOMAIN>/_nuxt/node_modules/.cache/vite/client/deps/vue-router.js?v=47f21660:1812:27)
at renderComponentRoot (https://<DOMAIN>/_nuxt/node_modules/.cache/vite/client/deps/chunk-BVUZKNJ3.js?v=1161d169:2350:17)
at ReactiveEffect.componentUpdateFn [as fn] (https://<DOMAIN>/_nuxt/node_modules/.cache/vite/client/deps/chunk-BVUZKNJ3.js?v=1161d169:7466:46)
at ReactiveEffect.run (https://<DOMAIN>/_nuxt/node_modules/.cache/vite/client/deps/chunk-BVUZKNJ3.js?v=1161d169:435:19)
at instance.update (https://<DOMAIN>/_nuxt/node_modules/.cache/vite/client/deps/chunk-BVUZKNJ3.js?v=1161d169:7597:17)
at setupRenderEffect (https://<DOMAIN>/_nuxt/node_modules/.cache/vite/client/deps/chunk-BVUZKNJ3.js?v=1161d169:7607:5)
at mountComponent (https://<DOMAIN>/_nuxt/node_modules/.cache/vite/client/deps/chunk-BVUZKNJ3.js?v=1161d169:7375:7)
at processComponent (https://<DOMAIN>/_nuxt/node_modules/.cache/vite/client/deps/chunk-BVUZKNJ3.js?v=1161d169:7329:9)

browser.mjs:44  error [nuxt] error caught during app initialization TypeError: Cannot set properties of null (setting '__vrv_devtools')
    at vue-router.mjs:2466:30
    at Array.forEach (<anonymous>)
    at Proxy.<anonymous> (vue-router.mjs:2464:35)
    at renderComponentRoot (runtime-core.esm-bundler.js:887:16)
    at ReactiveEffect.componentUpdateFn [as fn] (runtime-core.esm-bundler.js:6020:46)
    at ReactiveEffect.run (reactivity.esm-bundler.js:177:19)
    at instance.update (runtime-core.esm-bundler.js:6151:16)
    at setupRenderEffect (runtime-core.esm-bundler.js:6161:5)
    at mountComponent (runtime-core.esm-bundler.js:5929:7)
    at processComponent (runtime-core.esm-bundler.js:5883:9)
log @ browser.mjs:44
_log @ core.mjs:381
resolveLog @ core.mjs:349
_logFn @ core.mjs:377
(anonymous) @ core.mjs:306
(anonymous) @ nuxt.js:98
(anonymous) @ index.mjs:48
(anonymous) @ index.mjs:48
app:error (async)
serialTaskCaller @ index.mjs:46
callHookWith @ index.mjs:198
callHook @ index.mjs:187
handleVueError @ entry.js:6
callWithErrorHandling @ runtime-core.esm-bundler.js:195
handleError @ runtime-core.esm-bundler.js:242
renderComponentRoot @ runtime-core.esm-bundler.js:923
componentUpdateFn @ runtime-core.esm-bundler.js:6020
run @ reactivity.esm-bundler.js:177
instance.update @ runtime-core.esm-bundler.js:6151
setupRenderEffect @ runtime-core.esm-bundler.js:6161
mountComponent @ runtime-core.esm-bundler.js:5929
processComponent @ runtime-core.esm-bundler.js:5883
patch @ runtime-core.esm-bundler.js:5351
componentUpdateFn @ runtime-core.esm-bundler.js:6027
run @ reactivity.esm-bundler.js:177
instance.update @ runtime-core.esm-bundler.js:6151
setupRenderEffect @ runtime-core.esm-bundler.js:6161
mountComponent @ runtime-core.esm-bundler.js:5929
processComponent @ runtime-core.esm-bundler.js:5883
patch @ runtime-core.esm-bundler.js:5351
mountChildren @ runtime-core.esm-bundler.js:5599
mountElement @ runtime-core.esm-bundler.js:5506
processElement @ runtime-core.esm-bundler.js:5471
patch @ runtime-core.esm-bundler.js:5339
componentUpdateFn @ runtime-core.esm-bundler.js:6027
run @ reactivity.esm-bundler.js:177
instance.update @ runtime-core.esm-bundler.js:6151
setupRenderEffect @ runtime-core.esm-bundler.js:6161
mountComponent @ runtime-core.esm-bundler.js:5929
processComponent @ runtime-core.esm-bundler.js:5883
patch @ runtime-core.esm-bundler.js:5351
mountSuspense @ runtime-core.esm-bundler.js:1260
process @ runtime-core.esm-bundler.js:1200
patch @ runtime-core.esm-bundler.js:5376
componentUpdateFn @ runtime-core.esm-bundler.js:6027
run @ reactivity.esm-bundler.js:177
instance.update @ runtime-core.esm-bundler.js:6151
setupRenderEffect @ runtime-core.esm-bundler.js:6161
mountComponent @ runtime-core.esm-bundler.js:5929
processComponent @ runtime-core.esm-bundler.js:5883
patch @ runtime-core.esm-bundler.js:5351
render2 @ runtime-core.esm-bundler.js:6672
mount @ runtime-core.esm-bundler.js:3938
app.mount @ runtime-dom.esm-bundler.js:1535
initApp @ entry.js:8
await in initApp (async)
(anonymous) @ entry.js:10

The text was updated successfully, but these errors were encountered:

stackblitz · 2024-05-18T14:51:39Z

Start a new pull request in StackBlitz Codeflow.

github-ulrd73-wo2xbj (Open reproduction)

danielroe · 2024-05-18T14:56:12Z

The reproduction doesn't run because of missing files. Would you be able to make it more minimal and ensure it reproduces the issue? 🙏

github-actions · 2024-05-18T14:56:25Z

Would you be able to provide a reproduction? 🙏

More info

Why do I need to provide a reproduction?

Reproductions make it possible for us to triage and fix issues quickly with a relatively small team. It helps us discover the source of the problem, and also can reveal assumptions you or we might be making.

What will happen?

If you've provided a reproduction, we'll remove the label and try to reproduce the issue. If we can, we'll mark it as a bug and prioritize it based on its severity and how many people we think it might affect.

If needs reproduction labeled issues don't receive any substantial activity (e.g., new comments featuring a reproduction link), we'll close them. That's not because we don't care! At any point, feel free to comment with a reproduction and we'll reopen it.

How can I create a reproduction?

We have a couple of templates for starting with a minimal reproduction:

👉 https://stackblitz.com/github/nuxt/starter/tree/v3-stackblitz
👉 https://codesandbox.io/s/github/nuxt/starter/v3-codesandbox

A public GitHub repository is also perfect. 👌

Please ensure that the reproduction is as minimal as possible. See more details in our guide.

You might also find these other articles interesting and/or helpful:

manchakkay · 2024-05-18T15:23:34Z

Here is another attempt to reproduce the error, but as I see outside the server everything starts successfully
https://stackblitz.com/~/github.com/manchakkay/nuxt-rh64j235l

Therefore, it turns out to rely only on the error log, however, I understand very little from it and have difficulty understanding the relationship with one of the my files

manchakkay · 2024-05-18T15:50:25Z

So, a little clarification:

There was a small error in the vue file of the page, but it was only possible to view it in preview mode

The original error is as expected:
500 Cannot read properties of undefined (reading 'sort')

In dev mode, any error is replaced with:
500 Cannot set properties of null (setting '__vrv_devtools')

If the error occurs without restarting the server (in dev mode), it will be shown in the required format, but if the error is not fixed, then after restarting the server (as it was after installing the package), this screen will pop up

manchakkay added 3.x pending triage labels May 18, 2024

danielroe added the needs reproduction label May 18, 2024

danielroe removed the needs reproduction label May 18, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Cannot set properties of null (setting '__vrv_devtools') #27270

Cannot set properties of null (setting '__vrv_devtools') #27270

manchakkay commented May 18, 2024

stackblitz bot commented May 18, 2024

danielroe commented May 18, 2024

github-actions bot commented May 18, 2024

Why do I need to provide a reproduction?

What will happen?

How can I create a reproduction?

manchakkay commented May 18, 2024

manchakkay commented May 18, 2024 •

edited

Cannot set properties of null (setting '__vrv_devtools') #27270

Cannot set properties of null (setting '__vrv_devtools') #27270

Comments

manchakkay commented May 18, 2024

Environment

Reproduction

Describe the bug

Additional context

Logs

stackblitz bot commented May 18, 2024

danielroe commented May 18, 2024

github-actions bot commented May 18, 2024

Why do I need to provide a reproduction?

What will happen?

How can I create a reproduction?

manchakkay commented May 18, 2024

manchakkay commented May 18, 2024 • edited

manchakkay commented May 18, 2024 •

edited