---
title: "自动导入"
description: "此示例演示了 Nuxt 中的自动导入功能。"
canonical_url: "https://nuxt.zhcndoc.com/docs/examples/features/auto-imports"
---
# 自动导入

> 此示例演示了 Nuxt 中的自动导入功能。

::code-explorer{path="examples/features/auto-imports" default-value="app.vue"}
::

::browser{src="https://auto-imports.example.nuxt.space"}
::

Nuxt 中自动导入功能的示例，包含：

- `components/` 目录中的 Vue 组件会自动导入，并且可以直接在模板中使用。
- `composables/` 目录中的 Vue composables 会自动导入，并且可以直接在模板和 JS/TS 文件中使用。
- `utils/` 目录中的 JS/TS 变量和函数会自动导入，并且可以直接在模板和 JS/TS 文件中使用。

::read-more{to="https://nuxt.zhcndoc.com/docs/guide/directory-structure/components"}
::

::read-more{to="https://nuxt.zhcndoc.com/docs/guide/directory-structure/composables"}
::

::read-more{to="https://nuxt.zhcndoc.com/docs/guide/directory-structure/utils"}
::

---

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


## Sitemap

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