模块
Nuxt Kit 提供了一套工具，帮助你创建和使用模块。你可以使用这些工具来创建你自己的模块，或者重用现有的模块。
模块是 Nuxt 的构建块。Kit 提供了一套工具，帮助你创建和使用模块。你可以使用这些工具来创建你自己的模块，或者重用现有的模块。例如，你可以使用 defineNuxtModule 函数来定义一个模块，使用 installModule 函数以编程方式安装一个模块。
defineNuxtModule
定义一个 Nuxt 模块，自动合并默认值与用户提供的选项，安装提供的任何钩子，并调用一个可选的设置函数以获得完全的控制。
类型
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
}
参数
definition
类型: ModuleDefinition<T> | NuxtModule<T>
必需: true
一个模块定义对象或一个模块函数。
meta(可选)
类型:ModuleMeta
模块的元数据。它定义了模块名称、版本、配置键和兼容性。defaults(可选)
类型:T | ((nuxt: Nuxt) => T)
模块的默认选项。如果提供一个函数，它将使用 Nuxt 实例作为第一个参数被调用。schema(可选)
类型:T
模块选项的架构。如果提供，选项将应用到架构上。hooks(可选)
类型:Partial<NuxtHooks>
模块要安装的钩子。如果提供，模块将安装钩子。setup(可选)
类型:(this: void, resolvedOptions: T, nuxt: Nuxt) => Awaitable<void | false | ModuleSetupReturn>
模块的设置函数。如果提供，模块将调用设置函数。
示例
// 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 函数。
类型
async function installModule (moduleToInstall: string | NuxtModule, inlineOptions?: any, nuxt?: Nuxt)
参数
moduleToInstall
类型: string | NuxtModule
必需: true
要安装的模块。可以是模块名称的字符串或模块对象本身。
inlineOptions
类型: any
默认: {}
一个包含要传递给模块 setup 函数的模块选项的对象。
nuxt
类型: Nuxt
默认: useNuxt()
Nuxt 实例。如果没有提供，它将通过 useNuxt() 调用从上下文检索。
示例
import { defineNuxtModule, installModule } from '@nuxt/kit'
export default defineNuxtModule({
async setup (options, nuxt) {
// 将安装 @nuxtjs/fontaine 模块，使用 Roboto 字体和 Impact 字体作为备用
await installModule('@nuxtjs/fontaine', {
// 模块配置
fonts: [
{
family: 'Roboto',
fallbacks: ['Impact'],
fallbackName: 'fallback-a',
}
]
})
}
})