- 配置参考 Configuration
- 入门指南
- 介绍 Introduction
- 安装 Installation
- 配置 Configuration
- 视图 Views
- 资产 Assets
- 路由 Routing
- SEO and Meta
- 过渡 Transitions
- 数据获取 Data Fetching
- 状态管理 State Management
- 错误处理 Error handling
- 层结构 Layers
- 部署 Deployment
- 测试 Testing
- 升级指南 Upgrade Guide
- 核心概念
- 自动导入 Auto imports
- Vue.Js Vue.js Development
- 渲染模式 Rendering Modes
- 服务端引擎 Server Engine
- 模块化 Modules
- ES模块 ES Modules
- TypeScript TypeScript
- 目录结构
- 可组合项
- 组件
- 工具库
- fetch
- abortNavigation
- addRouteMiddleware
- clearError
- clearNuxtData
- createError
- defineNuxtComponent
- defineNuxtRouteMiddleware
- definePageMeta
- navigateTo
- onBeforeRouteLeave
- onBeforeRouteUpdate
- onNuxtReady
- prefetchComponents
- preloadComponents
- preloadRouteComponents
- refreshNuxtData
- reloadNuxtApp
- setPageLayout
- setResponseStatus
- showError
- updateAppConfig
- CLI 命令
- 进阶
- 深入探究
- 迁移指南
文章来源于网络收集而来,版权归原创者所有,如有侵权请及时联系!
模块化 Modules
Nuxt 提供了一个模块系统来扩展框架核心并简化集成。
Nuxt 提供了一个模块系统来扩展框架核心并简化集成。 如果已经有一个 Nuxt 模块,您不需要从头开始开发或维护样板文件。
可以使用 nuxt.config
添加 Nuxt 模块。
探索 Nuxt 模块
在使用 Nuxt 开发生产级应用程序时,您可能会发现框架的核心功能还不够。 Nuxt 可以通过配置选项和插件进行扩展,但在多个项目中维护这些定制可能是乏味、重复和耗时的。 另一方面,开箱即用地支持每个项目的需求会使 Nuxt 非常复杂且难以使用。
这也是 Nuxt 提供模块系统使得扩展核心成为可能的原因之一。 Nuxt 模块是异步函数,当使用 nuxi dev
在开发模式下启动 Nuxt 或使用 nuxi build
构建用于生产的项目时,它们会顺序运行。 他们可以覆盖模板、配置 webpack 加载器、添加 CSS 库以及执行许多其他有用的任务。
最重要的是,Nuxt 模块可以在 npm 包中分发。 这使得它们可以跨项目重复使用并与社区共享,从而帮助创建高质量附加组件的生态系统。
modules
属性
安装模块后,您可以将它们添加到 modules
属性下的 nuxt.config.ts
文件中。 模块开发人员通常会提供额外的使用步骤和详细信息。
export default defineNuxtConfig({
modules: [
// 使用包名(推荐用法)
'@nuxtjs/example',
// 加载本地模块
'./modules/example',
// 添加带有内联选项的模块
['./modules/example', { token: '123' }]
// 内联模块定义
async (inlineOptions, nuxt) => { }
]
})
Nuxt 模块现在仅限构建时,Nuxt 2 中使用的 buildModules
属性已弃用,取而代之的是 modules。
模块开发
每个人都有机会开发模块。 在 模块作者指南 中阅读有关开发模块的更多信息。
相关阅读:Module Author Guide如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论