` like this:\n\n```vue\n\u003Ctemplate>\n \u003CNuxtLoadingIndicator />\n \u003CAppNavbar />\n \u003Cdiv class=\"h-32\" />\n \u003CUContainer>\n \u003CNuxtLayout>\n \u003CNuxtPage />\n \u003C/NuxtLayout>\n \u003C/UContainer>\n \u003Cdiv class=\"h-32\" />\n \u003CAppFooter />\n\u003C/template>\n```\nmy index page on page/\n\n```vue\n \u003Ctemplate>\n \u003Cmain class=\"min-h-screen\">\n \u003Cdiv class=\"space-y-24\">\n \u003CHomeIntro />\n \u003CHomePremiumService />\n \u003CHomeWork />\n \u003CHomeSocialLinks />\n \u003CHomeFeaturedProjects />\n \u003CHomeFeaturedArticles />\n \u003CHomeTestimonials />\n \u003CHomeContactCTA />\n \u003C/div>\n \u003C/main>\n\u003C/template>\n```\n\nI’ve created a video demonstrating the issue I'm encountering with Nuxt. The video shows the flashing behavior when navigating between pages, even though I have set up transitions as expected.\n\nhttps://github.com/user-attachments/assets/50acdc47-bb18-4f89-b186-f6f220cd731c\n\nEven though the transition is defined, navigation causes a brief white screen before the new content appears. It seems like the layout or components are unmounted/re-mounted unexpectedly.\n\n## What I’ve tried\n\n- Using static assets (`\u003CNuxtImg>`) with placeholder and blur.\n- Moving layout elements inside Nuxt layouts.\n- Ensuring no SSR hydration errors.\n- Checked for large images or fonts causing flashes.\n- Tried with `nuxt@3.8.1`, but got package warnings on `glob@7.x`.\n\n## Possible cause\n\nIt seems like `\u003CNuxtPage />` renders **before** layout is fully hydrated, or there's a delay with dynamic components (like `useSeoMeta`, runtime config, or `\u003CNuxtImg>`). \nMaybe the `transition` hook isn't synced with the component load.\n\n## Questions\n\n- Is this a known issue with page transitions in Nuxt 3?\n- Should layout or page transitions be handled differently to avoid this kind of visual glitch?\n- Any workaround for a smoother visual transition without flicker?\n\nThanks in advance 🙏\n",[2865,2868],{"name":2866,"color":2867},"pending triage","E99695",{"name":2869,"color":2870},"needs reproduction","FBCA04",32053,"nuxt","open","💥 Nuxt Page Transition causes a Flash / Blank when navigating — possible layout/rendering issue","2025-05-09T14:47:20Z","https://github.com/nuxt/nuxt/issues/32053",0.7366765,{"description":2879,"labels":2880,"number":2890,"owner":2872,"repository":2872,"state":2873,"title":2891,"updated_at":2892,"url":2893,"score":2894},"### Environment\r\n\r\n- Operating System: `Darwin`\r\n- Node Version: `v16.19.0`\r\n- Nuxt Version: `3.6.5`\r\n- Nitro Version: `2.5.2`\r\n- Package Manager: `pnpm@8.3.1`\r\n- Builder: `vite`\r\n- User Config: `extends`, `srcDir`, `build`, `hooks`, `runtimeConfig`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/nuxt-starter-l1dvnf?file=app.vue\r\n\r\n### Describe the bug\r\n\r\nThere's actually two manifestations of this bug.\r\n\r\nFirst bug:\r\n- Given two pages, A & B, and two layouts, X and Y\r\n- Page A uses Template X\r\n- Page B uses Template Y\r\n- When navigating to page A, it will mount the CSS for Template X\r\n- When navigating to page B, it will mount the CSS for Template Y\r\n- However, when navigating **_back_** to page A, it will not _remove_ the CSS for template Y.\r\n- **Bug:** This means, effectively, that page A's rendering is unstable, and will render differently depending on preceding navigation.\r\n\r\nSecond bug:\r\n- Given the above, if you use pre-fetching with `NuxtLink` (`\u003CNuxtLink>` without `noPrefetch`), then the CSS for template Y will be injected into the page when navigating to page A, even though it has no association with Template Y.\r\n- In other words, Nuxt eagerly injects CSS un-associated with the current page\r\n\r\nNote that the first bug occurs whether or not you use `noPrefetch`.\r\n\r\n\r\n### Additional context\r\n\r\nI originally thought this bug was associated with / the same bug as https://github.com/nuxt/nuxt/issues/3877, but was told that was not the case, so filing this new issue. I also thought it might be the exact same as [this issue](https://github.com/nuxt/nuxt/issues/13778), but that issue is closed?\r\n\r\n### Logs\r\n\r\n_No response_",[2881,2882,2885,2887],{"name":2866,"color":2867},{"name":2883,"color":2884},"bug","d73a4a",{"name":2886,"color":2870},"🔨 p3-minor",{"name":2888,"color":2889},"performance","E84B77",22817,"Nuxt does not clean up CSS after navigation (and injects CSS pre-navigation)","2024-11-28T13:52:13Z","https://github.com/nuxt/nuxt/issues/22817",0.74624527,{"description":2896,"labels":2897,"number":2898,"owner":2872,"repository":2899,"state":2900,"title":2901,"updated_at":2902,"url":2903,"score":2904},"- [ ] Search\n- [ ] Subnavbar Links\n- [ ] Examples\n- [ ] Community / Open Source Guides\n- [ ] v2 migration nuxtjs.org",[],1306,"nuxt.com","closed","Documentation Update","2023-07-10T12:42:01Z","https://github.com/nuxt/nuxt.com/issues/1306",0.69619226,{"labels":2906,"number":2916,"owner":2872,"repository":2872,"state":2900,"title":2917,"updated_at":2918,"url":2919,"score":2920},[2907,2910,2913],{"name":2908,"color":2909},"enhancement","8DEF37",{"name":2911,"color":2912},"3.x","29bc7f",{"name":2914,"color":2915},"dx","C39D69",13828,"Navigation fails if pages do not have single root element","2023-09-12T14:58:48Z","https://github.com/nuxt/nuxt/issues/13828",0.7238192,{"description":2922,"labels":2923,"number":2926,"owner":2872,"repository":2872,"state":2900,"title":2927,"updated_at":2928,"url":2929,"score":2930},"### Environment\n\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v16.20.0\r\n- Nuxt Version: 3.7.3\r\n- CLI Version: 3.8.3\r\n- Nitro Version: 2.6.3\r\n- Package Manager: npm@9.4.2\r\n- Builder: -\r\n- User Config: -\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-lgq6ak?file=pages%2Fsetup%2F%5Bid%5D.vue\r\n\r\nSetup syntax page:\r\n1. Go to /setup\r\n2. Click on Setup 4 link then click again while the page is loading\r\n\r\nSame in options api page:\r\n1. Go to /items\r\n2. Click on Item 4 link then click again while the page is loading\r\n\r\n\r\nError in console:\r\n\r\n\u003Cimg width=\"1021\" alt=\"Screenshot 2023-09-14 at 3 42 53 PM\" src=\"https://github.com/nuxt/nuxt/assets/133578172/24bdb859-49cb-4ee0-a578-64f0bfa3834d\">\r\n\n\n### Describe the bug\n\nWhen navigating to a page that has an awaiting promise, navigating elsewhere while the page is loading well break the app untill I hard refresh\r\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2924,2925],{"name":2911,"color":2912},{"name":2866,"color":2867},23218,"Navigation breaks when clicking nuxt-link twice while page is loading","2023-09-14T13:56:16Z","https://github.com/nuxt/nuxt/issues/23218",0.73271114,{"labels":2932,"number":2937,"owner":2872,"repository":2872,"state":2900,"title":2938,"updated_at":2939,"url":2940,"score":2941},[2933,2934],{"name":2866,"color":2867},{"name":2935,"color":2936},"2.x","d4c5f9",9802,"Missing 404 fallback on Nuxt JS website","2023-01-22T15:45:05Z","https://github.com/nuxt/nuxt/issues/9802",0.73622894,{"labels":2943,"number":2945,"owner":2872,"repository":2872,"state":2900,"title":2946,"updated_at":2947,"url":2948,"score":2949},[2944],{"name":2935,"color":2936},8309,"there is no contribute guide","2023-01-18T15:32:39Z","https://github.com/nuxt/nuxt/issues/8309",0.7375565,{"labels":2951,"number":2954,"owner":2872,"repository":2872,"state":2900,"title":2955,"updated_at":2939,"url":2956,"score":2957},[2952,2953],{"name":2866,"color":2867},{"name":2935,"color":2936},9797,"after call error method in fetch navigation not working","https://github.com/nuxt/nuxt/issues/9797",0.7377756,{"description":2959,"labels":2960,"number":2962,"owner":2872,"repository":2963,"state":2900,"title":2964,"updated_at":2965,"url":2966,"score":2967},"### Environment\r\n\r\n- Operating System: Darwin\r\n- Node Version: v20.11.1\r\n- Nuxt Version: 3.11.2\r\n- CLI Version: 3.11.1\r\n- Nitro Version: 2.9.6\r\n- Package Manager: pnpm@8.14.0\r\n- Builder: -\r\n- User Config: experimental, alias, devtools, srcDir, imports, ssr, nitro, extensions, sourcemap, runtimeConfig, hooks, routeRules, css, build, modules, auth, plugins, gtag, tailwindcss, ui, colorMode, vite, vue, app\r\n- Runtime Modules: @pinia/nuxt@0.5.1, nuxt-gtag@0.5.7, @nuxt/eslint@0.3.7, @sidebase/nuxt-auth@0.7.2, @pinia-plugin-persistedstate/nuxt@1.2.0, @vueuse/nuxt@10.9.0, @nuxt/ui@2.15.1\r\n- Build Modules: -\r\n---------------------------\r\n\r\n### Version\r\n\r\nv2.15.1\r\n\r\n### Reproduction\r\n\r\nCan provide if needed\r\n\r\n### Description\r\n\r\nHi there,\r\nAbsolutely loving this library so far... this is the best UI component library I've ever used, across any framework.\r\nOne small issue though - I'm unable to use NuxtLink's `replace` in both the `HorizontalNavigation` and `VerticalNavigation`, even though the docs say I can use any property from NuxtLink. Passing `to` works perfectly, of course, but it's essential for me to `router.replace` the route and I'd rather not have to pass that as a `click` prop. The following doesn't work:\r\n\r\n```\r\n\u003Cscript setup lang='ts'>\r\nconst tabs = [\r\n ...,\r\n {\r\n replace: '/runs/bulk',\r\n label: 'Bulk Runs',\r\n icon: 'i-ph-list-bullets-bold',\r\n },\r\n]\r\n\u003C/script>\r\n\u003Ctemplate>\r\n \u003CUHorizontalNavigation\r\n :links=\"tabs\"\r\n :ui=\"{\r\n base: 'text-base font-bold',\r\n icon: { base: 'w-6 h-6' },\r\n }\"\r\n />\r\n\u003C/template>\r\n```\r\nAny help with this would be great! Thanks so much for all your hard work.\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2961],{"name":2883,"color":2884},1690,"ui","Cannot pass NuxtLink `replace` to Nav components","2025-05-14T14:22:12Z","https://github.com/nuxt/ui/issues/1690",0.73908865,{"description":2969,"labels":2970,"number":2973,"owner":2872,"repository":2872,"state":2900,"title":2974,"updated_at":2975,"url":2976,"score":2977},"### Environment\n\nNuxt project info: \r\n\r\n------------------------------\r\n- Operating System: `Windows_NT`\r\n- Node Version: `v16.17.0`\r\n- Nuxt Version: `3.0.0-rc.11`\r\n- Nitro Version: `0.5.4`\r\n- Package Manager: `npm@8.19.2`\r\n- Builder: `vite`\r\n- User Config: `-`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n------------------------------\r\n\n\n### Reproduction\n\n- Create a Nuxt module project:\r\n\r\n```\r\nnpx nuxi init -t module my-module\r\ncd my-module\r\nnpm i \r\nnpm run dev:prepare\r\n```\r\n\r\n- Make a call to `extendPages` within `module.ts` to add a page:\r\n\r\n```ts [module.ts]\r\nextendPages((pages) => {\r\n pages.push({\r\n name: 'module-page',\r\n path: '/:slug(.*)*',\r\n // @ts-ignore\r\n file: resolve(runtimeDir, './MyPage.vue')\r\n })\r\n})\r\n```\r\n- Add a page `~/src/runtime/MyPage.vue`:\r\n\r\n```vue [MyPage.vue]\r\n\u003Ctemplate>\r\n \u003Cdiv>Hello!\u003C/div>\r\n\u003C/template>\r\n```\r\n\r\n- Update `app.vue` to add `\u003CNuxtLayout>` and `\u003CNuxtPage>`:\r\n\r\n```vue [app.vue]\r\n\u003Ctemplate>\r\n \u003Cdiv>\r\n \u003CNuxtLayout>\r\n \u003CNuxtPage />\r\n \u003C/NuxtLayout>\r\n \u003C/div>\r\n\u003C/template>\r\n```\r\n\r\n- Run the project with `npm run dev` and note that the page has not loaded:\r\n```\r\nPlugin by my-module!\r\n√ Vite server hmr 4 files in 50.259ms\r\n[Vue warn]: Failed to resolve component: NuxtPage\r\nIf this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.\r\nPlugin by my-module!\r\n[Vue warn]: Component \u003CAnonymous> is missing template or render function.\r\n√ Vite server hmr 4 files in 143.147ms\r\n[Vue warn]: Failed to resolve component: NuxtPage\r\nIf this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.\r\nPlugin by my-module!\r\n```\n\n### Describe the bug\n\nNuxt cleverly strips out all router functionality if a project does not have a pages directory. However, this functionality is still removed if an installed module calls 'extendPages', so modules can't actually provide pages unless the project itself already has some, which may not always be the case.\r\n\r\nI think router functionality should be preserved by Nuxt if `extendPages` is called.\r\n\n\n### Additional context\n\nI am creating a module which creates a catch all page so I can do my own routing. I don't want to need to create a page in every project in order for my module's page to take effect. I can imagine other modules will want to act similarly, even if they're only providing more specific routes/pages.\n\n### Logs\n\n_No response_",[2971,2972],{"name":2911,"color":2912},{"name":2866,"color":2867},15060,"Nuxt does not include router functionality when a module calls extendPages unless the project has its own pages directory","2023-01-19T17:44:18Z","https://github.com/nuxt/nuxt/issues/15060",0.7396697,["Reactive",2979],{},["Set"],["ShallowReactive",2982],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fbCgT6VwLOnFdlHBO5FKHLxNdP_l8hXvL1YVmr9JoYUE":-1},"/nuxt/nuxt.com/994"]