通过 100+ 条技巧学习 Nuxt!

modules

使用 modules/ 目录自动注册应用程序中的本地模块。

这是放置您在构建应用程序时开发的任何本地模块的好地方。

自动注册的文件模式为

  • modules/*/index.ts
  • modules/*.ts

您不需要将这些本地模块单独添加到您的 nuxt.config.ts 中。

// `nuxt/kit` is a helper subpath import you can use when defining local modules
// that means you do not need to add `@nuxt/kit` to your project's dependencies
import { 
createResolver
,
defineNuxtModule
,
addServerHandler
} from 'nuxt/kit'
export default
defineNuxtModule
({
meta
: {
name
: 'hello'
},
setup
() {
const {
resolve
} =
createResolver
(import.meta.
url
)
// Add an API route
addServerHandler
({
route
: '/api/hello',
handler
:
resolve
('./runtime/api-route')
}) } })

启动 Nuxt 时,将注册 hello 模块,并且 /api/hello 路由将可用。

模块按以下顺序执行

  • 首先,加载在 nuxt.config.ts 中定义的模块。
  • 然后,执行在 modules/ 目录中找到的模块,它们按字母顺序加载。

您可以通过在每个目录名称前面添加一个数字来更改本地模块的顺序

目录结构
modules/
  1.first-module/
    index.ts
  2.second-module.ts
文档 > 指南 > 深入了解 > 模块 中阅读更多信息。
观看关于 Nuxt 私有模块的 Vue School 视频。