[RC 9] [RC 10] `Cannot read properties of undefined (reading 'modules')` when `vue` is installed in parent dir

Related issues

• #7532
• #7220
• #7573
• https://github.com/nuxt/framework/issues/7564
• sidestream-tech/sidebase#16

Reproduction

Minimal reproduction: https://stackblitz.com/edit/github-2yn1ze?file=app%2Fpackage.json,app%2Fnuxt.config.ts

Describe the bug

How it happens: If vue dependency is installed outside of project directory in an adjutant directory (usually home directory with node_modules), vite-node that is enabled by default for RC.9+ makes issues. (issue is with nuxt custom external options)

Additional context

Workaround 1

Try switching to the edge channel. It should have been solved with #7612.

Workaround 2

Check your home directory. If there is any node_modules dir, remove it or rename it. It is probably created wrongly in the past.

Workaround 3

It might be also because of a monorepo setup that has ../node_modules/vue dependency. In this case, switch to the legacy vite bundler:

export default defineNuxtConfig({
  vite: {
    devBundler: 'legacy',
  },
});

Remarks

The root cause of this issue is having multiple instances of vue in externals. In the future similar issue might happen with different causes as vue does not support multiple version instances.

[l4dybird]

@theolavaux It can be solved by modifying the package.json of each package as follows.

{
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "devDependencies": {
    "@vue/server-renderer": "3.2.45",
    "@vue/runtime-core": "3.2.45",
    "nuxt": "3.0.0",
    "vue": "3.2.45",
    "vue-bundle-renderer": "1.0.0"
  }
}

sample https://github.com/l4dybird/nuxt3-monorepo

[andreas83]

i had this issue even with 3.0.0-rc.11-27722816.abd0feb, node_modules removed from project and parent dir as well adding legacy devBunder to nuxt.config.ts.

At the end, removing the yarn.lock file fixed the issue for me.

Nuxt 3.0.0-rc.11-27722816.abd0feb with Nitro 0.5.4-27719614.c3af02d                                                                                                      09:58:22
                        
[Vue warn]: inject() can only be used inside setup() or functional components.
[Vue warn]: Server rendering context not provided. Make sure to only call useSSRContext() conditionally in the server build.
[Vue warn]: Unhandled error during execution of setup function 
  at <NuxtRoot>
[nuxt] [request error] [unhandled] [500] Cannot read properties of undefined (reading 'modules')
  at _sfc_main.setup (./node_modules/nuxt/dist/app/components/nuxt-root.vue:67:16)  
  at callWithErrorHandling (./node_modules/vue/node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:157:22)  
  at setupStatefulComponent (./node_modules/vue/node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:7109:29)  
  at setupComponent (./node_modules/vue/node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:7064:11)  
  at renderComponentVNode (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:172:17)  
  at renderToString (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:450:26)  
  at Object.renderToString$1 [as renderToString] (./.nuxt/dev/index.mjs:472:24)  
  at Object.renderToString (./node_modules/vue-bundle-renderer/dist/runtime.mjs:173:40)  
  at processTicksAndRejections (node:internal/process/task_queues:96:5)  
  at async ./.nuxt/dev/index.mjs:527:21

---

• Operating System: Linux
• Node Version: v16.13.1
• Nuxt Version: 3.0.0-rc.11-27722816.abd0feb
• Nitro Version: 0.5.4-27719614.c3af02d
• Package Manager: yarn@1.21.1
• Builder: vite
• User Config: buildModules, publicRuntimeConfig
• Runtime Modules: -
• Build Modules: nuxt-windicss@2.5.2

---