模块
Nuxt 提供了一个模块系统来扩展框架核心并简化集成。
探索 Nuxt 模块
在使用 Nuxt 开发生产级应用程序时,您可能会发现框架的核心功能不足。Nuxt 可以通过配置选项和插件进行扩展,但跨多个项目维护这些自定义项可能会很繁琐、重复且耗时。另一方面,开箱即用地支持每个项目的需要会使 Nuxt 变得非常复杂且难以使用。
这就是 Nuxt 提供模块系统的原因之一,它使扩展核心成为可能。Nuxt 模块是异步函数,在开发模式下使用 nuxi dev
启动 Nuxt 或使用 nuxi build
构建生产项目时,这些函数会按顺序运行。它们可以覆盖模板、配置 webpack 加载器、添加 CSS 库以及执行许多其他有用的任务。
最棒的是,Nuxt 模块可以分发到 npm 包中。这使得它们可以在项目之间重复使用并与社区共享,有助于创建高质量的插件生态系统。
添加 Nuxt 模块
安装模块后,您可以在 nuxt.config.ts
文件的 modules
属性下添加它们。模块开发者通常会提供额外的步骤和使用细节。
nuxt.config.ts
export default defineNuxtConfig({
modules: [
// Using package name (recommended usage)
'@nuxtjs/example',
// Load a local module
'./modules/example',
// Add module with inline-options
['./modules/example', { token: '123' }],
// Inline module definition
async (inlineOptions, nuxt) => { }
]
})
Nuxt 模块现在仅限于构建时,Nuxt 2 中使用的
buildModules
属性已弃用,取而代之的是 modules
。创建 Nuxt 模块
每个人都有机会开发模块,我们迫不及待地想看看您将构建什么。