Автоимпорты

Исходный код
Nuxt Kit предоставляет утилиты для настройки автоимпортов — регистрации собственных функций, композаблов и API Vue.

Nuxt подключает вспомогательные функции, композаблы и API Vue без явных импортов; по соглашениям о каталогах в автоимпорт попадают, например, ваши композаблы из composables/.

Через Kit можно добавлять свои символы: addImports и addImportsDir регистрируют импорты в приложении, addImportsSources — явный список имён из сторонних пакетов.

Под капотом тот же unimport, что и в самом Nuxt.

Эти функции предназначены для регистрации собственных утилит, композаблов и API Vue. Для страниц, компонентов и плагинов см. разделы: Страницы, Компоненты, Плагины.
Посмотрите видео Vue School об автоимпортах в Nuxt Kit.

addImports

Добавляет импорт в приложение Nuxt, чтобы символ был доступен без ручного import.

Для автоимпортов в контексте сервера Nitro используйте addServerImports.

Использование

import { addImports, defineNuxtModule } from '@nuxt/kit'

export default defineNuxtModule({
  setup (options, nuxt) {
    const names = [
      'useStoryblok',
      'useStoryblokApi',
      'useStoryblokBridge',
      'renderRichText',
      'RichTextSchema',
    ]

    names.forEach(name =>
      addImports({ name, as: name, from: '@storyblok/vue' }),
    )
  },
})

Тип

function addImports (imports: Import | Import[]): void

Параметры

imports: объект или массив объектов со свойствами:

СвойствоТипОбязательноОписание
namestringtrueИмя символа для автоимпорта.
fromstringtrueМодуль, из которого импортировать.
prioritynumberfalseПриоритет; при совпадении имён побеждает больший приоритет.
disabledbooleanfalseОтключить этот импорт.
metaRecord<string, any>falseМетаданные импорта.
typebooleanfalseТолько типовой импорт.
typeFromstringfalseЗначение from для генерации деклараций типов.
asstringfalseЛокальное имя импорта.

addImportsDir

Регистрирует импорты из каталога: экспорты из его файлов становятся доступны в приложении без ручных импортов.

Использование

import { addImportsDir, createResolver, defineNuxtModule } from '@nuxt/kit'

export default defineNuxtModule({
  meta: {
    name: '@vueuse/motion',
    configKey: 'motion',
  },
  setup (options, nuxt) {
    const resolver = createResolver(import.meta.url)
    addImportsDir(resolver.resolve('./runtime/composables'))
  },
})

Тип

function addImportsDir (dirs: string | string[], options?: { prepend?: boolean }): void

Параметры

СвойствоТипОбязательноОписание
dirsstring | string[]trueПуть или массив путей к каталогу.
options{ prepend?: boolean }falseПри prepend: true импорты добавляются в начало списка.

addImportsSources

Регистрирует в приложении Nuxt перечисленные импорты из указанного модуля.

Использование

import { addImportsSources, defineNuxtModule } from '@nuxt/kit'

export default defineNuxtModule({
  setup () {
    addImportsSources({
      from: 'h3',
      imports: [
        'defineEventHandler',
        'getQuery',
        'getRouterParams',
        'readBody',
        'sendRedirect',
      ],
    })
  },
})

Тип

function addImportsSources (importSources: ImportSource | ImportSource[]): void

Параметры

importSources: объект или массив объектов со свойствами:

СвойствоТипОбязательноОписание
fromstringtrueМодуль, из которого импортируются символы.
importsPresetImport | ImportSource[]trueИмена импорта, объекты импорта или вложенные источники.