Layers

Nuxt Kit 提供了帮助你处理层及其目录结构的工具。

Nuxt 层提供了一种强大的方式，用于在项目之间共享和扩展功能。在模块中处理层时，你经常需要访问每个层的目录路径。Nuxt Kit 提供了 getLayerDirectories 工具，用于访问 Nuxt 应用中所有层的已解析目录路径。

`getLayerDirectories`

获取 Nuxt 应用中所有层的已解析目录路径。该函数提供了一种结构化的方式来访问层目录，而无需直接访问私有的 nuxt.options._layers 属性。

用法

import { defineNuxtModule, getLayerDirectories } from '@nuxt/kit'

export default defineNuxtModule({
  setup () {
    const layerDirs = getLayerDirectories()

    // 访问所有层的目录
    for (const [index, layer] of layerDirs.entries()) {
      console.log(`Layer ${index}:`)
      console.log(`  Root: ${layer.root}`)
      console.log(`  App: ${layer.app}`)
      console.log(`  Server: ${layer.server}`)
      console.log(`  Pages: ${layer.appPages}`)
      // ... 其他目录
    }
  },
})

类型

// @errors: 2391
import type { Nuxt } from '@nuxt/schema'
// ---cut---
function getLayerDirectories (nuxt?: Nuxt): LayerDirectories[]

interface LayerDirectories {
  /** Nuxt rootDir（默认为 `/`） */
  readonly root: string
  /** Nitro 源代码目录（默认为 `/server`） */
  readonly server: string
  /** 本地模块目录（默认为 `/modules`） */
  readonly modules: string
  /** 共享目录（默认为 `/shared`） */
  readonly shared: string
  /** 公共目录（默认为 `/public`） */
  readonly public: string
  /** Nuxt srcDir（默认为 `/app/`） */
  readonly app: string
  /** 布局目录（默认为 `/app/layouts`） */
  readonly appLayouts: string
  /** 中间件目录（默认为 `/app/middleware`） */
  readonly appMiddleware: string
  /** 页面目录（默认为 `/app/pages`） */
  readonly appPages: string
  /** 插件目录（默认为 `/app/plugins`） */
  readonly appPlugins: string
}

参数

nuxt（可选）：要获取层的 Nuxt 实例。如果未提供，函数会使用当前的 Nuxt 上下文。

返回值

getLayerDirectories 函数返回一个 LayerDirectories 对象数组，应用中每个层对应一个。

层优先级排序：层按优先级排序，其中：

第一个层是用户/项目层（最高优先级）
数组前面的层会覆盖后面的层
基础层出现在数组最后（最低优先级）

这种排序与 Nuxt 的层解析系统一致，用户自定义配置和文件优先于来自基础层的配置和文件。

LayerDirectories：一个包含层的已解析目录路径的对象。

属性	类型	描述
`root`	`string`	层的根目录（等同于 `rootDir`）
`server`	`string`	Nitro 服务端代码的服务器目录
`modules`	`string`	本地模块目录
`shared`	`string`	客户端和服务端都会用到的代码共享目录
`app`	`string`	层的源代码目录（等同于 `srcDir`）
`public`	`string`	静态资源的公共目录
`appLayouts`	`string`	Vue 布局组件的布局目录
`appMiddleware`	`string`	路由中间件的中间件目录
`appPages`	`string`	基于文件的路由的页面目录
`appPlugins`	`string`	Nuxt 插件的插件目录

示例

处理来自所有层的文件：

// @errors: 2307
// ---cut---
import { defineNuxtModule, getLayerDirectories } from '@nuxt/kit'
import { resolve } from 'pathe'
import { globby } from 'globby'

export default defineNuxtModule({
  async setup () {
    const layerDirs = getLayerDirectories()

    // 在层之间查找所有组件文件
    // 注意：layerDirs[0] 是用户层（最高优先级）
    // 数组中靠后的层优先级更低
    const componentFiles = []
    for (const [index, layer] of layerDirs.entries()) {
      const files = await globby('**/*.vue', {
        cwd: resolve(layer.app, 'components'),
        absolute: true,
      })
      console.log(`Layer ${index} (${index === 0 ? 'user' : 'base'}):`, files.length, 'components')
      componentFiles.push(...files)
    }
  },
})

从多个层添加模板：

import { addTemplate, defineNuxtModule, getLayerDirectories } from '@nuxt/kit'
import { basename, resolve } from 'pathe'
import { existsSync } from 'node:fs'

export default defineNuxtModule({
  setup () {
    const layerDirs = getLayerDirectories()

    // 为每个拥有该文件的层添加一个配置文件
    for (const dirs of layerDirs) {
      const configPath = resolve(dirs.app, 'my-module.config.ts')
      if (existsSync(configPath)) {
        addTemplate({
          filename: `my-module-${basename(dirs.root)}.config.ts`,
          src: configPath,
        })
      }
    }
  },
})

尊重层优先级：

import { defineNuxtModule, getLayerDirectories } from '@nuxt/kit'
import { resolve } from 'pathe'
import { existsSync, readFileSync } from 'node:fs'

export default defineNuxtModule({
  setup () {
    const layerDirs = getLayerDirectories()

    // 找到第一个（最高优先级）拥有特定配置文件的层
    // 这会尊重层优先级系统
    let configContent = null
    for (const dirs of layerDirs) {
      const configPath = resolve(dirs.app, 'my-config.json')
      if (existsSync(configPath)) {
        configContent = readFileSync(configPath, 'utf-8')
        console.log(`Using config from layer: ${dirs.root}`)
        break // 使用找到的第一个（最高优先级）配置
      }
    }

    // 替代方案：从所有层收集配置，用户层优先
    const allConfigs = {}
    for (const dirs of layerDirs.reverse()) { // 从最低优先级到最高优先级处理
      const configPath = resolve(dirs.app, 'my-config.json')
      if (existsSync(configPath)) {
        const config = JSON.parse(readFileSync(configPath, 'utf-8'))
        Object.assign(allConfigs, config) // 后面的赋值覆盖前面的
      }
    }
  },
})

检查层特定的目录：

import { defineNuxtModule, getLayerDirectories } from '@nuxt/kit'
import { existsSync } from 'node:fs'
import { resolve } from 'pathe'

export default defineNuxtModule({
  setup () {
    const layerDirs = getLayerDirectories()

    // 找到拥有特定自定义目录的层
    const layersWithAssets = layerDirs.filter((layer) => {
      return existsSync(resolve(layer.app, 'assets'))
    })

    console.log(`Found ${layersWithAssets.length} layers with assets directory`)
  },
})

getLayerDirectories 函数通过 WeakMap 进行缓存，避免对相同层重复计算目录路径，从而提升多次调用时的性能。 :

该函数返回的目录路径末尾始终包含一个斜杠，以保持一致性。 :