Nuxt/docs/3.api/4.advanced/2.kit.md
2023-07-29 15:37:26 +03:00

5.5 KiB

title description
Kit Utilities Nuxt Kit provides composable utilities to help interacting with Nuxt Hooks and Nuxt Builder.

Kit Utilities

::ReadMore{link="/docs/guide/going-further/kit"} ::

Modules

source code

installModule

Install specified Nuxt module programmatically. This is helpful when your module depends on other modules. You can pass the module options as an object to inlineOptions and they will be passed to the module's setup function.

Type

async function installModule (moduleToInstall: string | NuxtModule, inlineOptions?: any, nuxt?: Nuxt)

Parameters

moduleToInstall

Type: string | NuxtModule

Required: true

The module to install. Can be either a string with the module name or a module object itself.

inlineOptions

Type: any

Default: {}

An object with the module options to be passed to the module's setup function.

nuxt

Type: Nuxt

Default: useNuxt()

Nuxt instance. If not provided, it will be retrieved from the context via useNuxt() call.

Examples

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

export default defineNuxtModule<ModuleOptions>({  
  async setup (options, nuxt) {
    // will install @nuxtjs/fontaine with Roboto font and Impact fallback
    await installModule('@nuxtjs/fontaine', {
      // module configuration
      fonts: [
        {
          family: 'Roboto',
          fallbacks: ['Impact'],
          fallbackName: 'fallback-a',
        }
      ]
    })
  }
})

Programmatic Usage

source code

Programmatic usage can be helpfull when you want to use Nuxt programmatically, for example, when building a CLI tool or test runner.

loadNuxt

Load Nuxt programmatically.

Type

async function loadNuxt (loadOptions?: LoadNuxtOptions): Promise<Nuxt>

interface LoadNuxtOptions extends LoadNuxtConfigOptions {
  dev?: boolean
  ready?: boolean
  rootDir?: string
  config?: LoadNuxtConfigOptions['overrides']
}

Parameters

loadOptions

Type: LoadNuxtOptions

Default: {}

Loading conditions for Nuxt. loadNuxt uses c12 under the hood, so it accepts the same options as c12.loadConfig with some additional options:

  • dev (optional)

    Type: boolean

    Default: false

    If set to true, Nuxt will be loaded in development mode.

  • ready (optional)

    Type: boolean

    Default: true

    If set to true, Nuxt will be ready to use after the loadNuxt call. If set to false, you will need to call nuxt.ready() to make sure Nuxt is ready to use.

  • rootDir (optional)

    Type: string

    Default: null

    Deprecated: Use cwd option instead.

    The root directory of the Nuxt project.

  • config (optional)

    Type: LoadNuxtConfigOptions['overrides']

    Default: {}

    Deprecated: Use overrides option instead.

    Overrides for the Nuxt configuration.

buildNuxt(nuxt)

loadNuxtConfig(loadOptions)

Compatibility

source code

  • checkNuxtCompatibility(constraints)
  • assertNuxtCompatibility(constraints)
  • hasNuxtCompatibility(constraints)
  • isNuxt2()
  • isNuxt3()
  • getNuxtVersion()

Auto-imports

source code

  • addImports(imports)
  • addImportsDir(importDirs, { prepend? })
  • addImportsSources(importSources)

Components

source code

  • addComponentsDir(dir)
  • addComponent(componentObject)

Context

source code

  • useNuxt()

Pages

source code

  • extendPages (callback: pages => void)
  • extendRouteRules (route: string, rule: NitroRouteConfig, options: ExtendRouteRulesOptions)
  • addRouteMiddleware (input: NuxtMiddleware | NuxtMiddleware[], options: AddRouteMiddlewareOptions)

Plugins

source code

  • addPlugin(pluginOptions, { append? })
  • addPluginTemplate(pluginOptions, { append? })

Templates

source code

  • addTemplate(templateOptions)
  • addTypeTemplate(templateOptions)
  • updateTemplates({ filter?: ResolvedNuxtTemplate => boolean })

Nitro

source code

  • addServerHandler (handler)
  • addDevServerHandler (handler)
  • useNitro() (only usable after ready hook)
  • addServerPlugin
  • addPrerenderRoutes

Resolving

source code

  • resolvePath (path, resolveOptions?)
  • resolveAlias (path, aliases?)
  • findPath (paths, resolveOptions?)
  • createResolver (base)

Logging

source code

  • useLogger(scope?)

Builder

source code

  • extendWebpackConfig(callback, options?)
  • extendViteConfig(callback, options?)
  • addWebpackPlugin(webpackPlugin, options?)
  • addVitePlugin(vitePlugin, options?)