nuxt: Undefined route in Nuxt layout component in prod build
Environment
- Operating System: `Linux`
- Node Version: `v16.18.0`
- Nuxt Version: `3.0.0-rc.13`
- Nitro Version: `0.6.1`
- Package Manager: `pnpm@7.15.0`
- Builder: `vite`
- User Config: `modules`, `oxyshopNuxt`, `i18n`, `experimental`
- Runtime Modules: `normalizedModule()`, `normalizedModule()`
- Build Modules: `-`
Reproduction
Build to prod
Describe the bug
In the dev environment everything works fine, once the application build to production. on the client side Nuxt RC-13 crashes on the error that the route is undefined. https://github.com/nuxt/framework/blob/59d8c51b5bd8d8f7de66f83494d9d39110e43c44/packages/nuxt/src/app/components/layout.ts#L73 On Nuxt RC-12 it works fine.
Additional context
Logs
TypeError: Cannot read properties of undefined (reading 'meta')
at zc.fn (entry.6b774f36.js:78:63198)
at zc.run (entry.6b774f36.js:1:4282)
at get value [as value] (entry.6b774f36.js:1:12410)
at Proxy.<anonymous> (entry.6b774f36.js:78:63258)
at fl (entry.6b774f36.js:1:15833)
at St (entry.6b774f36.js:1:49906)
at zc.V [as fn] (entry.6b774f36.js:1:49994)
at zc.run (entry.6b774f36.js:1:4282)
at G.T.update (entry.6b774f36.js:1:50299)
at G (entry.6b774f36.js:1:50325)
nE @ entry.6b774f36.js:1
About this issue
- Original URL
- State: closed
- Created 2 years ago
- Reactions: 1
- Comments: 29 (21 by maintainers)
The issue seems to be that
@gtm-support/vue-gtm
is pulling in a separate copy ofvue-router
.For now you can workaround with:
I am on v4.1.6 since it was released and yet I still face this error on Nuxt edge.
Please do provide a reproduction if that’s the case. This is an upstream issue (not directly caused by Nuxt) but if there’s anything I can do to help resolve this, I will.
Does it really work?
@danielroe Confirmed that upgrading to
vue-router
version 4.1.6 has fixed this issue. 🙏@danielroe I finally managed to create a reproduction of this infernal bug! https://stackblitz.com/edit/github-ecbwau?file=package.json
Steps:
$ pnpm install
$ pnpm run build
$ node .output/server/index.mjs
just upgrate vue-router to 4.1.6! It`s work perfect for me(nuxt 3.0.0)
I have an observation which might help to narrow it down a bit.
I encountered this issue also when going from rc.12 to ^rc.14 and 1.0.0. It only happened when using
pnpm install --shamefully-hoist
. Usingnpm
didn’t produce this problem.The cause of it for me was our internal components library. It was enough for it to be included in
package.json
of a clean nuxt project. I’d get the error event without importing any part of it. Been trying to make a reproduction, but couldn’t.Adding
auto-install-peers=true
to.npmrc
solved the issue.I didn’t encounter this issue until upgrading from rc-12 to 1.0.0. In dev and in local build it works fine, but as soon as it is deployed to Netlify I’m hit with the error
cannot read properties of undefined (reading 'meta')
. The page loads for a split second and then the error is encountered and the page goes white.Looking at
pnpm-lock.yaml
, vue router and vue are at the latest versions as above.@danielroe Any ideas? Could it have something to do with the fact that this project only uses one template, ie the
pages
folder only contains two files[[slug]].vue
and404.vue
? Still strange that it’s only on production in Netlify that it’s occuring.Have had to revert to rc-12 in the meantime until resolved.
For me
vue 3.2.45
andvue-router 4.1.6
still throw an error with an undefined route.Oh well, I spent way too many hours deep inside code just to find out I had to update my
vue
dependency to at least3.2.45
! The error is gone now.