# modules

> Каталог modules/ — локальные модули Nuxt с автоматической регистрацией.

Это место для размещения любых локальных модулей, которые вы разрабатываете при создании приложения.

Поддерживаются такие шаблоны путей к локальным модулям:

- `modules/*/index.ts`
- `modules/*.ts`

Их не нужно отдельно перечислять в [`nuxt.config.ts`](/docs/3.x/directory-structure/nuxt-config).

<code-group>

```ts [modules/hello/index.ts]twoslash
// `nuxt/kit` — это хелпер для импорта подпути, который можно использовать при определении локальных модулей
// это означает, что вам не нужно добавлять `@nuxt/kit` в зависимости вашего проекта
import { addComponentsDir, addServerHandler, createResolver, defineNuxtModule } from 'nuxt/kit'

export default defineNuxtModule({
  meta: {
    name: 'hello',
  },
  setup () {
    const resolver = createResolver(import.meta.url)

    // Добавление роута API
    addServerHandler({
      route: '/api/hello',
      handler: resolver.resolve('./runtime/api-route'),
    })

    // Добавление директории компонентов
    addComponentsDir({
      path: resolver.resolve('./runtime/app/components'),
      pathPrefix: true, // префикс экспортов, чтобы избежать конфликтов с кодом пользователя или другими модулями
    })
  },
})
```

```ts [modules/hello/runtime/api-route.ts]twoslash
export default defineEventHandler(() => {
  return { hello: 'world' }
})
```

</code-group>

При запуске Nuxt будет зарегистрирован модуль `hello` и станет доступен маршрут `/api/hello`.

<note>

Все компоненты, страницы, композаблы и прочие файлы, которые обычно лежат в `app/`, для модуля нужно размещать в `modules/your-module/runtime/app/`. Так они корректно проходят проверку типов.

</note>

Модули выполняются в следующей последовательности:

- Сначала загружаются модули, указанные в [`nuxt.config.ts`](/docs/3.x/api/nuxt-config#modules-1).
- Затем выполняются модули, найденные в директории `modules/`, и они загружаются в алфавитном порядке.

Вы можете изменить порядок локальных модулей, добавив номер в начало имени каждой директории:

```bash [Directory structure]
modules/
  1.first-module/
    index.ts
  2.second-module.ts
```

<read-more to="/docs/3.x/guide/modules">



</read-more>

<tip icon="i-lucide-video" target="_blank" to="https://vueschool.io/lessons/creating-your-first-module-from-scratch?friend=nuxt">

Посмотрите видео от Vue School о закрытых модулях Nuxt.

</tip>