diff --git a/docs/2.guide/1.concepts/1.auto-imports.md b/docs/2.guide/1.concepts/1.auto-imports.md index 37ae82097c..76da9c05d9 100644 --- a/docs/2.guide/1.concepts/1.auto-imports.md +++ b/docs/2.guide/1.concepts/1.auto-imports.md @@ -17,7 +17,9 @@ You can find a reference for auto-imported [composables](/docs/api/composables/u Auto imports don't currently work within the [server directory](/docs/guide/directory-structure/server). :: -## Nuxt Auto-imports +## Built-in Auto-imports + +### Nuxt Auto-imports Nuxt auto-imports functions and composables to perform [data fetching](/docs/getting-started/data-fetching), get access to the [app context](/docs/api/composables/use-nuxt-app) and [runtime config](/docs/guide/going-further/runtime-config), manage [state](/docs/getting-started/state-management) or define components and plugins. @@ -28,7 +30,7 @@ Nuxt auto-imports functions and composables to perform [data fetching](/docs/get ``` -## Vue Auto-imports +### Vue Auto-imports Vue 3 exposes Reactivity APIs like `ref` or `computed`, as well as lifecycle hooks and helpers that are auto-imported by Nuxt. @@ -40,6 +42,48 @@ Vue 3 exposes Reactivity APIs like `ref` or `computed`, as well as lifecycle hoo ``` +### Using Vue and Nuxt composables + + + +When you are using the built-in composition API composables provided by Vue and Nuxt, be aware that many of them rely on being called in the right _context_. + +During a component lifecycle, Vue tracks the temporary instance of the current component (and similarly, Nuxt tracks a temporary instance of `nuxtApp`) via a global variable, and then unsets it in same tick. This is essential when server rendering, both to avoid cross-request state pollution (leaking a shared reference between two users) and to avoid leakage between different components. + +That means that (with very few exceptions) you cannot use them outside a Nuxt plugin, Nuxt route middleware or Vue setup function. On top of that, you must use them synchronously - that is, you cannot use `await` before calling a composable, except within `