模块

Nuxt 提供了一个模块系统,用于扩展框架核心并简化集成。

探索 Nuxt 模块

在开发生产级 Nuxt 应用时,你可能会发现框架的核心功能不足以满足需求。Nuxt 可以通过配置选项和插件进行扩展,但在多个项目中维护这些定制可能会显得繁琐、重复且耗时。另一方面,如果 Nuxt 开箱即用支持每个项目的所有需求,会使框架变得非常复杂且难以使用。

这就是 Nuxt 提供模块系统的原因之一,该系统使得扩展核心成为可能。Nuxt 模块是异步函数,在使用 nuxi dev 启动 Nuxt 开发模式或使用 nuxi build 为生产环境构建项目时按顺序运行。它们可以覆盖模板、配置 Webpack 加载器、添加 CSS 库以及执行许多其他实用任务。

最棒的是,Nuxt 模块可以封装在 npm 包中分发。这使得它们可以在多个项目中重用并与社区共享,有助于打造一个高质量的附加组件生态系统。

探索 Nuxt 模块

添加 Nuxt 模块

安装模块后,你可以在 nuxt.config.ts 文件的 modules 属性中添加它们。模块开发者通常会提供额外的使用步骤和详细信息。

nuxt.config.ts
export default defineNuxtConfig({
  modules: [
    // 使用包名称(推荐用法)
    '@nuxtjs/example',

    // 加载本地模块
    './modules/example',

    // 使用内联选项添加模块
    ['./modules/example', { token: '123' }],

    // 内联模块定义
    async (inlineOptions, nuxt) => { }
  ]
})
Nuxt 模块现在仅在构建时运行,Nuxt 2 中使用的 buildModules 属性已废弃,推荐使用 modules

创建 Nuxt 模块

每个人都有机会开发模块,我们迫不及待想看到你会创造什么。

阅读更多 模块作者指南.

::