模块

模块是 Nuxt 的构建块。Kit 提供了一组实用程序来帮助你创建和使用模块。你可以使用这些实用程序创建自己的模块或复用现有模块。例如，你可以使用 defineNuxtModule 函数定义模块，并使用 installModule 函数以编程方式安装模块。

¥Modules are the building blocks of Nuxt. Kit provides a set of utilities to help you create and use modules. You can use these utilities to create your own modules or to reuse existing modules. For example, you can use the defineNuxtModule function to define a module and the installModule function to install a module programmatically.

defineNuxtModule

定义一个 Nuxt 模块，自动将默认值与用户提供的选项合并，安装所有提供的钩子，并调用可选的 setup 函数进行完全控制。

¥Define a Nuxt module, automatically merging defaults with user provided options, installing any hooks that are provided, and calling an optional setup function for full control.

类型

¥Type

function defineNuxtModule<OptionsT extends ModuleOptions> (definition: ModuleDefinition<OptionsT> | NuxtModule<OptionsT>): NuxtModule<OptionsT>

type ModuleOptions = Record<string, any>

interface ModuleDefinition<T extends ModuleOptions = ModuleOptions> {
  meta?: ModuleMeta
  defaults?: T | ((nuxt: Nuxt) => T)
  schema?: T
  hooks?: Partial<NuxtHooks>
  setup?: (this: void, resolvedOptions: T, nuxt: Nuxt) => Awaitable<void | false | ModuleSetupReturn>
}

interface NuxtModule<T extends ModuleOptions = ModuleOptions> {
  (this: void, inlineOptions: T, nuxt: Nuxt): Awaitable<void | false | ModuleSetupReturn>
  getOptions?: (inlineOptions?: T, nuxt?: Nuxt) => Promise<T>
  getMeta?: () => Promise<ModuleMeta>
}

interface ModuleSetupReturn {
  timings?: {
    setup?: number
    [key: string]: number | undefined
  }
}

interface ModuleMeta {
  name?: string
  version?: string
  configKey?: string
  compatibility?: NuxtCompatibility
  [key: string]: unknown
}

参数

¥Parameters

definition

类型：ModuleDefinition<T> | NuxtModule<T>

¥Type: ModuleDefinition<T> | NuxtModule<T>

必需：true

¥Required: true

模块定义对象或模块函数。

¥A module definition object or a module function.

• meta（可选）
  类型：ModuleMeta
  模块的元数据。它定义了模块名称、版本、配置键和兼容性。
• defaults（可选）
  类型：T | ((nuxt: Nuxt) => T)
  模块的默认选项。如果提供了函数，它将以 Nuxt 实例作为第一个参数被调用。
• schema（可选）
  类型：T
  模块选项的架构。如果提供，则选项将应用于架构。
• hooks（可选）
  类型：Partial<NuxtHooks>
  需要为模块安装的钩子。如果提供，模块将安装钩子。
• setup（可选）
  类型：(this: void, resolvedOptions: T, nuxt: Nuxt) => Awaitable<void | false | ModuleSetupReturn>
  模块的设置函数。如果提供，模块将调用设置函数。

示例

¥Examples

// https://github.com/nuxt/starter/tree/module
import { defineNuxtModule } from '@nuxt/kit'

export default defineNuxtModule({
  meta: {
    name: 'my-module',
    configKey: 'myModule'
  },
  defaults: {
    test: 123
  },
  setup (options, nuxt) {
    nuxt.hook('modules:done', () => {
      console.log('My module is ready with current test option: ', options.test)
    })    
  }
})

installModule

以编程方式安装指定的 Nuxt 模块。当你的模块依赖于其他模块时，此功能非常有用。你可以将模块选项作为对象传递给 inlineOptions，它们将被传递给模块的 setup 函数。

¥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

类型：string | NuxtModule

¥Type: string | NuxtModule

必需：true

¥Required: true

要安装的模块。可以是包含模块名称的字符串，也可以是模块对象本身。

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

inlineOptions

类型：any

¥Type: any

默认：{}

¥Default: {}

包含要传递给模块 setup 函数的模块选项的对象。

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

nuxt

类型：Nuxt

¥Type: Nuxt

默认：useNuxt()

¥Default: useNuxt()

Nuxt 实例。如果未提供，它将通过 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({  
  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',
        }
      ]
    })
  }
})