图层

源码
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()

    // Access directories from all layers
    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}`)
      // ... other directories
    }
  },
})

类型

function getLayerDirectories (nuxt?: Nuxt): LayerDirectories[]

interface LayerDirectories {
  /** Nuxt rootDir (`/` by default) */
  readonly root: string
  /** Nitro source directory (`/server` by default) */
  readonly server: string
  /** Local modules directory (`/modules` by default) */
  readonly modules: string
  /** Shared directory (`/shared` by default) */
  readonly shared: string
  /** Public directory (`/public` by default) */
  readonly public: string
  /** Nuxt srcDir (`/app/` by default) */
  readonly app: string
  /** Layouts directory (`/app/layouts` by default) */
  readonly appLayouts: string
  /** Middleware directory (`/app/middleware` by default) */
  readonly appMiddleware: string
  /** Pages directory (`/app/pages` by default) */
  readonly appPages: string
  /** Plugins directory (`/app/plugins` by default) */
  readonly appPlugins: string
}

参数

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

返回值

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

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

  • 第一个图层是用户/项目图层（最高优先级）
  • 数组中较早的图层会覆盖较晚的图层
  • 基础图层出现在数组的最后（最低优先级）

此顺序与 Nuxt 的图层解析系统一致，用户定义的配置和文件优先于基础图层提供的内容。

LayerDirectories：包含图层解析后目录路径的对象。

属性类型描述
rootstring图层的根目录（等同于 rootDir）
serverstring用于 Nitro 服务端代码的服务器目录
modulesstring本地模块目录
sharedstring同时被客户端和服务器使用的共享目录
appstring图层的源代码目录（等同于 srcDir）
publicstring用于静态资源的 public 目录
appLayoutsstringVue 布局组件的 layouts 目录
appMiddlewarestring路由中间件的 middleware 目录
appPagesstring基于文件路由的 pages 目录
appPluginsstringNuxt 插件的 plugins 目录

示例

处理来自所有图层的文件：

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

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

    // Find all component files across layers
    // Note: layerDirs[0] is the user layer (highest priority)
    // Later layers in the array have lower priority
    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()

    // Add a config file from each layer that has one
    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()

    // Find the first (highest priority) layer that has a specific config file
    // This respects the layer priority system
    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 // Use the first (highest priority) config found
      }
    }

    // Alternative: Collect configs from all layers, with user layer taking precedence
    const allConfigs = {}
    for (const dirs of layerDirs.reverse()) { // Process from lowest to highest priority
      const configPath = resolve(dirs.app, 'my-config.json')
      if (existsSync(configPath)) {
        const config = JSON.parse(readFileSync(configPath, 'utf-8'))
        Object.assign(allConfigs, config) // Later assignments override earlier ones
      }
    }
  },
})

检查特定图层目录是否存在：

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

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

    // Find layers that have a specific custom directory
    const layersWithAssets = layerDirs.filter((layer) => {
      return existsSync(resolve(layer.app, 'assets'))
    })

    console.log(`Found ${layersWithAssets.length} layers with assets directory`)
  },
})
getLayerDirectories 函数通过 WeakMap 实现了缓存，以避免对相同图层重复计算目录路径，从而在多次调用时提高性能。
此函数返回的目录路径始终包含尾随斜杠以保持一致性。