After upgrading from nuxt 3.6.5 to 3.13.0, new pages are inserted below old page
So I just upgraded from nuxt 3.6.5 to 3.13.0 and after adjusting the type imports for the "Verbatim Module Syntax" from typescript my website loads normally without any errors in the web console or the server, but when I change from one page to another, the content of the new page is just placed below the old page instead of replacing it.
As I dont get any errors or warnings, Im kinda stuck and do not know how to even begin troubleshooting this. Does anybody have had similar problems or can suggest how I should troubleshoot this?
1 Reply
Ive managed to narrow it down a bit. If I remove page transitioins, it works fine
So I painstakingly went through all components and pages, and wrapped those that returned multiple root elements in a div but sadly the issue persists. This site doesnt use layouts, I just have one app.vue but even that is wrapped in a div. Do you have any other suggestions?
ive als tried applying the transition just to the NuxtPage element in the app.vue instead of setting it inside the config but no difference
Okay in the end I found out, that the problem was that there was a
:key="$route.path" attribute on the <NuxtPage/> Element so it looked like this <NuxtPage :key="$route.path" />. This worked fine before the update but broke after it. Now that I removed it, the transitions work like intended. I also cant seem to figure out why the key was put there in the first place but I guess it was a workaround for something that got fixed/changed during a update