Шаблоны

Шаблоны позволяют генерировать дополнительные файлы во время разработки и сборки. Эти файлы будут доступны в виртуальной файловой системе и могут быть использованы в плагинах, лейаутах, компонентах и т.д. addTemplate и addTypeTemplate позволяют вам добавлять шаблоны в приложение Nuxt. updateTemplates позволяет вам повторно генерировать шаблоны, соответствующие фильтру.

addTemplate

Отображает заданный шаблон во время сборки в buildDir проекта.

Тип

function addTemplate (template: NuxtTemplate | string): ResolvedNuxtTemplate

interface NuxtTemplate {
  src?: string
  filename?: string
  dst?: string
  options?: Record<string, any>
  getContents?: (data: Record<string, any>) => string | Promise<string>
  write?: boolean
}

interface ResolvedNuxtTemplate {
  src: string
  filename: string
  dst: string
  options: Record<string, any>
  getContents: (data: Record<string, any>) => string | Promise<string>
  write: boolean
  filename: string
  dst: string
}

Параметры

template

Тип: NuxtTemplate | string

Обязательный: true

Объект шаблона или строка с путем к шаблону. Если предоставлена строка, она будет преобразована в объект шаблона с src установленным в значение строки. Если предоставлен объект шаблона, он должен иметь следующие свойства:

• src (опциональный)
  Тип: string
  Путь к шаблону. Если src не предоставлен, то вместо него должен быть предоставлен getContents.
• filename (опциональный)
  Тип: string
  Имя файла шаблона. Если filename не предоставлен, оно будет сгенерировано из пути src. В этом случае требуется опция src.
• dst (опциональный)
  Тип: string
  Путь к целевому файлу. Если dst не предоставлен, он будет сгенерирован из пути filename и опции buildDir nuxt.
• options (опциональный)
  Тип: Options
  Опции для передачи в шаблон.
• getContents (опциональный)
  Тип: (data: Options) => string | Promise<string>
  Функция, которая будет вызвана с объектом options. Она должна возвращать строку или промис, который разрешается в строку. Если предоставлен src, эта функция будет проигнорирована.
• write (опциональный)
  Тип: boolean
  Если установлено в true, шаблон будет записан в целевой файл. В противном случае, шаблон будет использоваться только в виртуальной файловой системе.

Примеры

// https://github.com/nuxt/bridge
import { addTemplate, defineNuxtModule } from '@nuxt/kit'
import { defu } from 'defu'

export default defineNuxtModule({
  setup(options, nuxt) {
    const globalMeta = defu(nuxt.options.app.head, {
      charset: options.charset,
      viewport: options.viewport
    })

    addTemplate({
      filename: 'meta.config.mjs',
      getContents: () => 'export default ' + JSON.stringify({ globalMeta, mixinKey: 'setup' })
    })
  }
})

addTypeTemplate

Отображает заданный шаблон во время сборки в buildDir проекта, а затем регистрирует его в качестве типов.

Тип

function addTypeTemplate (template: NuxtTypeTemplate | string): ResolvedNuxtTemplate

interface NuxtTemplate {
  src?: string
  filename?: string
  dst?: string
  options?: Record<string, any>
  getContents?: (data: Record<string, any>) => string | Promise<string>
}

interface ResolvedNuxtTemplate {
  src: string
  filename: string
  dst: string
  options: Record<string, any>
  getContents: (data: Record<string, any>) => string | Promise<string>
  write: boolean
  filename: string
  dst: string
}

Параметры

template

Тип: NuxtTypeTemplate | string

Обязательный: true

Объект шаблона или строка с путем к шаблону. Если предоставлена строка, она будет преобразована в объект шаблона с src установленным в значение строки. Если предоставлен объект шаблона, он должен иметь следующие свойства:

• src (опциональный)
  Тип: string
  Путь к шаблону. Если src не предоставлен, то вместо него должен быть предоставлен getContents.
• filename (опциональный)
  Тип: string
  Имя файла шаблона. Если filename не предоставлен, оно будет сгенерировано из пути src. В этом случае требуется опция src.
• dst (опциональный)
  Тип: string
  Путь к целевому файлу. Если dst не предоставлен, он будет сгенерирован из пути filename и опции buildDir nuxt.
• options (опциональный)
  Тип: Options
  Опции для передачи в шаблон.
• getContents (опциональный)
  Тип: (data: Options) => string | Promise<string>
  Функция, которая будет вызвана с объектом options. Она должна возвращать строку или промис, который разрешается в строку. Если предоставлен src, эта функция будет проигнорирована.

Примеры

// https://github.com/Hebilicious/nuxtpress
import { addTypeTemplate, defineNuxtModule } from "@nuxt/kit"

export default defineNuxtModule({
  setup() {
    addTypeTemplate({
      filename: "types/markdown.d.ts",
      getContents: () => /* ts */`
      declare module '*.md' {
        import type { ComponentOptions } from 'vue'
        const Component: ComponentOptions
        export default Component
      }`
    })
  }
}

updateTemplates

Перегенерировать шаблоны, соответствующие фильтру. Если фильтр не предоставлен, будут перегенерированы все шаблоны.

Тип

async function updateTemplates (options: UpdateTemplatesOptions): void

interface UpdateTemplatesOptions {
  filter?: (template: ResolvedNuxtTemplate) => boolean
}

interface ResolvedNuxtTemplate {
  src: string
  filename: string
  dst: string
  options: Record<string, any>
  getContents: (data: Record<string, any>) => string | Promise<string>
  write: boolean
  filename: string
  dst: string
}

Параметры

options

Тип: UpdateTemplatesOptions

По умолчанию: {}

Опции для передачи в шаблон. Этот объект может иметь следующее свойство:

• filter (опциональный)
  Тип: (template: ResolvedNuxtTemplate) => boolean
  Функция, которая будет вызвана с объектом template. Она должна возвращать логическое значение, указывающее, следует ли перегенерировать шаблон. Если filter не предоставлен, будут перегенерированы все шаблоны.

Пример

// https://github.com/nuxt/nuxt
import { defineNuxtModule, updateTemplates } from '@nuxt/kit'

export default defineNuxtModule({
  setup(options, nuxt) {
    // следить и перестраивать список шаблонов маршрутов, когда одна из страниц изменяется
    nuxt.hook('builder:watch', async (event, relativePath) => {
      if (event === 'change') { return }

      const path = resolve(nuxt.options.srcDir, relativePath)
      if (updateTemplatePaths.some(dir => path.startsWith(dir))) {
        await updateTemplates({
          filter: template => template.filename === 'routes.mjs'
        })
      }
    })
  }
})