From f5879dbf4dedf470e08ccc51d47c5d12d726e585 Mon Sep 17 00:00:00 2001 From: Conner Date: Wed, 16 Nov 2022 15:06:36 +0100 Subject: [PATCH] docs: add warning about `definePageMeta` issues with transitions and `NuxtLoadingIndicator` (#9055) Co-authored-by: Daniel Roe --- docs/content/1.docs/1.getting-started/5.transitions.md | 4 ++++ .../1.docs/3.api/2.components/5.nuxt-loading-indicator.md | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/docs/content/1.docs/1.getting-started/5.transitions.md b/docs/content/1.docs/1.getting-started/5.transitions.md index 5592a22c86c6..542701afbb09 100644 --- a/docs/content/1.docs/1.getting-started/5.transitions.md +++ b/docs/content/1.docs/1.getting-started/5.transitions.md @@ -19,6 +19,10 @@ export default defineNuxtConfig({ }) ``` +::alert{type=warning} +If you are changing layouts as well as page, the page transition you set here will not run. Instead, you should set a layout transition. +:: + To start adding transition between your pages, add the following CSS to your [`app.vue`](/docs/guide/directory-structure/app): ::code-group diff --git a/docs/content/1.docs/3.api/2.components/5.nuxt-loading-indicator.md b/docs/content/1.docs/3.api/2.components/5.nuxt-loading-indicator.md index c95f44911862..3c2d9529dede 100644 --- a/docs/content/1.docs/3.api/2.components/5.nuxt-loading-indicator.md +++ b/docs/content/1.docs/3.api/2.components/5.nuxt-loading-indicator.md @@ -19,6 +19,10 @@ Add `` in your `app.vue` or layouts. :button-link[Open on StackBlitz]{href="https://stackblitz.com/github/nuxt/framework/tree/main/examples/routing/pages?terminal=dev&file=/app.vue" blank} +::alert{type=warning} +If you are changing layouts as well as page, the page transition you set here will not run. Instead, you should set a layout transition. +:: + ## Slots You can pass custom HTML or components through the loading indicator's default slot.