layers

使用 layers/ 目录在你的应用中组织和自动注册本地 layers。

layers/ 目录允许你在整个 Nuxt 应用中组织和共享可复用的代码、组件、组合式函数和配置。项目中 layers/ 目录下的任何 layer 都会被自动注册。

layers/ 目录的自动注册功能在 Nuxt v3.12.0+ 中可用。

Layers 非常适合用领域驱动设计（DDD）组织大型代码库、创建可复用的 UI 库或主题、在多个项目间共享配置预设，以及分离管理后台或功能模块等关注点。

结构

layers/ 中的每个子目录都被视为一个独立的 layer。一个 layer 可以包含与标准 Nuxt 应用相同的结构。

每个 layer 必须包含一个 nuxt.config.ts 文件才能被识别为有效的 layer，即使它是空的。

Directory structure

-| layers/
---| base/
-----| nuxt.config.ts
-----| app/
-------| components/
---------| BaseButton.vue
-------| composables/
---------| useBase.ts
-----| server/
-------| api/
---------| hello.ts
---| admin/
-----| nuxt.config.ts
-----| app/
-------| pages/
---------| admin.vue
-------| layouts/
---------| admin.vue

自动别名

系统会自动为每个 layer 的 srcDir 创建具名 layer 别名。你可以使用 #layers/[name] 别名来访问某个 layer：

// 访问 base layer
import something from '#layers/base/path/to/file'

// 访问 admin layer
import { useAdmin } from '#layers/admin/composables/useAdmin'

具名 layer 别名在 Nuxt v3.16.0 中引入。

Layer 内容

每个 layer 可以包含：

nuxt.config.ts - layer 特定的配置，会与主配置合并
app.config.ts - 响应式应用配置
app/components/ - Vue 组件（自动导入）
app/composables/ - Vue 组合式函数（自动导入）
app/utils/ - 工具函数（自动导入）
app/pages/ - 应用页面
app/layouts/ - 应用布局
app/middleware/ - 路由中间件
app/plugins/ - Nuxt 插件
server/ - 服务端路由、中间件和工具函数
shared/ - 应用与服务端之间共享的代码

优先级顺序

当多个 layer 定义了相同的资源（组件、组合式函数、页面等）时，优先级更高的 layer 会胜出。layer 按字母顺序排序，字母靠后的优先级更高（Z > A）。

要控制顺序，可以给目录名添加数字前缀：1.base/、2.features/、3.admin/。

或者，在 extends（例如 extends: ['~~/layers/admin', '~~/layers/base']）中引用这些目录，以在不重命名的情况下从 nuxt.config 控制顺序，其中第一个条目的优先级最高。