Изучите Nuxt с коллекцией из 100+ советов!
Nuxt Kit предоставляет набор утилит, которые помогут вам разрешать пути. Эти функции позволяют вам разрешать пути, относительные к текущему модулю, с неизвестным именем или расширением.

Иногда вам необходимо разрешать пути: относительные к текущему модулю, с неизвестным именем или расширением. Например, вы можете захотеть добавить плагин, который находится в той же директории, что и модуль. Для обработки таких случаев Nuxt предоставляет набор утилит для разрешения путей. resolvePath и resolveAlias используются для разрешения путей, относительных к текущему модулю. findPath используется для поиска первого существующего файла в заданных путях. createResolver используется для создания резолвера, относительного к базовому пути.

resolvePath

Разрешает полный путь к файлу или директории, учитывая псевдонимы и опции расширений Nuxt. Если путь не может быть разрешен, будет возвращен нормализованный входной путь.

Тип

async function resolvePath (path: string, options?: ResolvePathOptions): Promise<string>

Параметры

path

Тип: string

Обязательный: true

Путь к резолву.

options

Тип: ResolvePathOptions

По умолчанию: {}

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

  • cwd (опционально)
    Тип: string
    По умолчанию: process.cwd()
    Текущая рабочая директория.
  • alias (опционально)
    Тип: Record<string, string>
    По умолчанию: {}
    Карта псевдонимов.
  • extensions (опционально)
    Тип: string[]
    По умолчанию: ['.js', '.mjs', '.ts', '.jsx', '.tsx', '.json']
    Расширения, которые нужно попробовать.

Примеры

// https://github.com/P4sca1/nuxt-headlessui
import { defineNuxtModule, resolvePath } from '@nuxt/kit'
import { join } from 'pathe'

const headlessComponents: ComponentGroup[] = [
  {
    relativePath: 'combobox/combobox.js',
    chunkName: 'headlessui/combobox',
    exports: [
      'Combobox',
      'ComboboxLabel',
      'ComboboxButton',
      'ComboboxInput',
      'ComboboxOptions',
      'ComboboxOption'
    ]
  },
]

export default defineNuxtModule({
  meta: {
    name: 'nuxt-headlessui',
    configKey: 'headlessui',
  },
  defaults: {
    prefix: 'Headless'
  },
  async setup (options) {
    const entrypoint = await resolvePath('@headlessui/vue')
    const root = join(entrypoint, '../components')

    for (const group of headlessComponents) {
      for (const e of group.exports) {
        addComponent(
          {
            name: e,
            export: e,
            filePath: join(root, group.relativePath),
            chunkName: group.chunkName,
            mode: 'all'
          }
        )
      }
    }
  }
})

resolveAlias

Разрешает псевдонимы путей в соответствии с опциями псевдонимов Nuxt.

Тип

function resolveAlias (path: string, alias?: Record<string, string>): string

Параметры

path

Тип: string

Обязательный: true

Путь к резолву.

alias

Тип: Record<string, string>

По умолчанию: {}

Карта псевдонимов. Если она не указана, она будет считана из nuxt.options.alias.

findPath

Попытайтесь разрешить первый существующий файл в заданных путях.

Тип

async function findPath (paths: string | string[], options?: ResolvePathOptions, pathType: 'file' | 'dir'): Promise<string | null>

interface ResolvePathOptions {
  cwd?: string
  alias?: Record<string, string>
  extensions?: string[]
}

Параметры

paths

Тип: string | string[]

Обязательный: true

Путь или массив путей для резолва.

options

Тип: ResolvePathOptions

По умолчанию: {}

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

  • cwd (опционально)
    Тип: string
    По умолчанию: process.cwd()
    Текущая рабочая директория.
  • alias (опционально)
    Тип: Record<string, string>
    По умолчанию: {}
    Карта псевдонимов.
  • extensions (опционально)
    Тип: string[]
    По умолчанию: ['.js', '.mjs', '.ts', '.jsx', '.tsx', '.json']
    Расширения, которые нужно попробовать.

pathType

Тип: 'file' | 'dir'

По умолчанию: 'file'

Тип или путь к резолву. Если задано значение 'file', функция попытается разрешить файл. Если задано значение 'dir', функция попытается разрешить каталог.

createResolver

Создает резолвер относительно базового пути.

Посмотрите видео от Vue School о createResolver.

Тип

function createResolver (basePath: string | URL): Resolver

interface Resolver {
  resolve (...path: string[]): string
  resolvePath (path: string, options?: ResolvePathOptions): Promise<string>
}

interface ResolvePathOptions {
  cwd?: string
  alias?: Record<string, string>
  extensions?: string[]
}

Параметры

basePath

Тип: string

Обязательный: true

Базовый путь для резолвера.

Примеры

// https://github.com/vuejs/pinia/blob/v2/packages/nuxt
import {
  defineNuxtModule,
  isNuxt2,
  createResolver,
} from '@nuxt/kit'

export default defineNuxtModule({
  setup(options, nuxt) {
    const resolver = createResolver(import.meta.url)

    nuxt.hook('modules:done', () => {
      if (isNuxt2()) {
        addPlugin(resolver.resolve('./runtime/plugin.vue2'))
      } else {
        addPlugin(resolver.resolve('./runtime/plugin.vue3'))
      }
    })
  }
})