layers
使用 layers/ 目录来组织和自动注册应用中的本地层。
layers/ 目录允许你在 Nuxt 应用中组织和共享可复用的代码、组件、组合式函数和配置。项目中 layers/ 目录下的任何层都会被自动注册。
layers/ 目录的自动注册功能自 Nuxt v3.12.0+ 起支持。Layers 非常适合利用领域驱动设计 (DDD) 来组织大型代码库,创建可复用的UI 库或主题,在多个项目间共享配置预设,以及分离关注点,比如管理面板或功能模块。
结构
layers/ 目录下的每个子目录都被视为一个独立的层。每个层可以包含与标准 Nuxt 应用相同的结构。
每个层必须包含一个
nuxt.config.ts 文件才能被识别为有效层,即使该文件为空。目录结构
-| 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
自动别名
会自动为每个层的 srcDir 创建命名层别名。你可以通过 #layers/[name] 别名来访问层:
// 访问 base 层
import something from '#layers/base/path/to/file'
// 访问 admin 层
import { useAdmin } from '#layers/admin/composables/useAdmin'
命名层别名于 Nuxt v3.16.0 引入。
层内容
每个层可以包含:
nuxt.config.ts- 层特定配置,会与主配置合并app.config.ts- 响应式应用配置components/- Vue 组件(自动导入)composables/- Vue 组合式函数(自动导入)utils/- 工具函数(自动导入)pages/- 应用页面layouts/- 应用布局middleware/- 路由中间件plugins/- Nuxt 插件server/- 服务器路由、中间件和实用工具shared/- 应用和服务器间共享代码
优先级顺序
当多个层定义了相同资源(组件、组合式函数、页面等)时,优先级更高的层将生效。层按字母顺序排序,字母越靠后优先级越高(Z > A)。
你可以通过在目录名前加数字前缀来控制顺序:1.base/、2.features/、3.admin/。