---
title: "Auto Imports"
description: "This example demonstrates the auto-imports feature in Nuxt."
canonical_url: "https://nuxt.com/docs/4.x/examples/features/auto-imports"
---
# Auto Imports

> This example demonstrates the auto-imports feature in Nuxt.

<code-explorer default-value="app.vue" path="examples/features/auto-imports">



</code-explorer>

<browser src="https://auto-imports.example.nuxt.space">



</browser>

Example of the auto-imports feature in Nuxt with:

- Vue components in the `components/` directory are auto-imported and can be used directly in your templates.
- Vue composables in the `composables/` directory are auto-imported and can be used directly in your templates and JS/TS files.
- JS/TS variables and functions in the `utils/` directory are auto-imported and can be used directly in your templates and JS/TS files.

<read-more to="https://nuxt.com/docs/guide/directory-structure/components">



</read-more>

<read-more to="https://nuxt.com/docs/guide/directory-structure/composables">



</read-more>

<read-more to="https://nuxt.com/docs/guide/directory-structure/utils">



</read-more>

---

- [Source](https://github.com/nuxt/examples/tree/main/examples/features/auto-imports)


## Sitemap

See the full [sitemap](https://nuxt.com/sitemap.md) for all pages.