Контекст · Nuxt Kit

Модули Nuxt позволяют вам расширить возможности Nuxt. Они предоставляют структурированный способ сохранения вашего кода организованным и модульным. Если вы ищете способ разделить ваш модуль на более мелкие компоненты, Nuxt предоставляет функции useNuxt и tryUseNuxt. Эти функции позволяют вам удобно получить доступ к экземпляру Nuxt из контекста, не передавая его в качестве аргумента.

Когда вы работаете с функцией setup в модулях Nuxt, Nuxt уже предоставляется в качестве второго аргумента. Это означает, что вы можете использовать его напрямую, не нуждаясь в вызове useNuxt(). В качестве примера использования вы можете посмотреть Nuxt Site Config.

`useNuxt`

Получите экземпляр Nuxt из контекста. Он выбросит ошибку, если Nuxt недоступен.

Тип

function useNuxt(): Nuxt

interface Nuxt {
  options: NuxtOptions
  hooks: Hookable<NuxtHooks>
  hook: Nuxt['hooks']['hook']
  callHook: Nuxt['hooks']['callHook']
  addHooks: Nuxt['hooks']['addHooks']
  ready: () => Promise<void>
  close: () => Promise<void>
  server?: any
  vfs: Record<string, string>
  apps: Record<string, NuxtApp>
}

Примеры

// https://github.com/Lexpeartha/nuxt-xstate/blob/main/src/parts/transpile.ts
import { useNuxt } from '@nuxt/kit'

export const setupTranspilation = () => {
  const nuxt = useNuxt()

  nuxt.options.build.transpile = nuxt.options.build.transpile || []

  if (nuxt.options.builder === '@nuxt/webpack-builder') {
    nuxt.options.build.transpile.push(
      'xstate',
    )
  }
}

`tryUseNuxt`

Получите экземпляр Nuxt из контекста. Он вернет null, если Nuxt недоступен.

Тип

function tryUseNuxt(): Nuxt | null

interface Nuxt {
  options: NuxtOptions
  hooks: Hookable<NuxtHooks>
  hook: Nuxt['hooks']['hook']
  callHook: Nuxt['hooks']['callHook']
  addHooks: Nuxt['hooks']['addHooks']
  ready: () => Promise<void>
  close: () => Promise<void>
  server?: any
  vfs: Record<string, string>
  apps: Record<string, NuxtApp>
}

Примеры

// https://github.com/harlan-zw/nuxt-site-config/blob/main/test/assertions.test.ts
import { tryUseNuxt } from '@nuxt/kit'

interface SiteConfig {
  title: string
}

export const requireSiteConfig = (): SiteConfig => {
  const nuxt = tryUseNuxt()
  if (!nuxt) {
    return { title: null }
  }
  return nuxt.options.siteConfig
}

Компоненты

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

Страницы

Nuxt Kit предоставляет набор утилит, которые помогут вам создавать и использовать страницы. Вы можете использовать эти утилиты для манипулирования конфигурацией страниц или для определения правил маршрутизации.