nuxt logo

Traducción de Documentación (No Oficial)

Nitro

Nuxt Kit proporciona un conjunto de utilidades para ayudarte a trabajar con Nitro. Estas funciones te permiten agregar manejadores de servidor, plugins y rutas de prerenderizado.

Nitro es un framework de TypeScript de código abierto para construir servidores web ultrarrápidos. Nuxt utiliza Nitro como su motor de servidor. Puedes usar useNitro para acceder a la instancia de Nitro, addServerHandler para agregar un manejador de servidor, addDevServerHandler para agregar un manejador de servidor que se usará solo en modo de desarrollo, addServerPlugin para agregar un plugin que extienda el comportamiento en tiempo de ejecución de Nitro, y addPrerenderRoutes para agregar rutas que serán prerenderizadas por Nitro.

addServerHandler

Agrega un manejador de servidor Nitro. Usa esto si deseas crear middleware de servidor o una ruta personalizada.

Uso

import { createResolver, defineNuxtModule, addServerHandler } from '@nuxt/kit'

export default defineNuxtModule({
  setup(options) {
    const { resolve } = createResolver(import.meta.url)

    addServerHandler({
      route: '/robots.txt',
      handler: resolve('./runtime/robots.get')
    })
  }
})

Tipo

function addServerHandler (handler: NitroEventHandler): void

Parámetros

handler: Un objeto manejador con las siguientes propiedades:

PropiedadTipoRequeridoDescripción
handlerstringtrueRuta al manejador de eventos.
routestringfalsePrefijo de ruta o ruta. Si se usa una cadena vacía, se usará como middleware.
middlewarebooleanfalseEspecifica que este es un manejador de middleware. Los middleware se llaman en cada ruta y normalmente no deben devolver nada para pasar a los siguientes manejadores.
lazybooleanfalseUsa carga diferida para importar el manejador. Esto es útil cuando solo deseas cargar el manejador bajo demanda.
methodstringfalseCoincidencia de método del enrutador. Si el nombre del manejador contiene el nombre del método, se usará como valor predeterminado.

Ejemplos

Uso Básico

Puedes usar addServerHandler para agregar un manejador de servidor desde tu módulo.

import { createResolver, defineNuxtModule, addServerHandler } from '@nuxt/kit'

export default defineNuxtModule({
  setup(options) {
    const { resolve } = createResolver(import.meta.url)

    addServerHandler({
      route: '/robots.txt',
      handler: resolve('./runtime/robots.get')
    })
  }
})

Cuando accedes a /robots.txt, devolverá la siguiente respuesta:

User-agent: *
Disallow: /

addDevServerHandler

Agrega un manejador de servidor Nitro que se usará solo en modo de desarrollo. Este manejador será excluido de la compilación de producción.

Uso

import { defineEventHandler } from 'h3'
import { createResolver, defineNuxtModule, addDevServerHandler } from '@nuxt/kit'

export default defineNuxtModule({
  setup() {
    addDevServerHandler({
      handler: defineEventHandler(() => {
        return {
          body: `Response generated at ${new Date().toISOString()}`
        }
      }),
      route: '/_handler'
    })
  }
})

Tipo

// @errors: 2391
import type { NitroDevEventHandler } from 'nitropack'
// ---cut---
function addDevServerHandler (handler: NitroDevEventHandler): void

Parámetros

handler: Un objeto manejador con las siguientes propiedades:

PropiedadTipoRequeridoDescripción
handlerEventHandlertrueManejador de eventos.
routestringfalsePrefijo de ruta o ruta. Si se usa una cadena vacía, se usará como middleware.

Ejemplos

Uso Básico

En algunos casos, puedes querer crear un manejador de servidor específicamente para propósitos de desarrollo, como un visor de configuración de Tailwind.

import { joinURL } from 'ufo'
import { defineNuxtModule, addDevServerHandler } from '@nuxt/kit'

export default defineNuxtModule({
  async setup(options, nuxt) {
    const route = joinURL(nuxt.options.app?.baseURL, '/_tailwind')

    // @ts-ignore
    const createServer = await import('tailwind-config-viewer/server/index.js').then(r => r.default || r) as any
    const viewerDevMiddleware = createServer({ tailwindConfigProvider: () => options, routerPrefix: route }).asMiddleware()

    addDevServerHandler({ route, handler: viewerDevMiddleware })
  }
})

useNitro

Devuelve la instancia de Nitro.

Puedes llamar a useNitro() solo después del hook ready.

Los cambios en la configuración de la instancia de Nitro no se aplican.

Uso

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

export default defineNuxtModule({
  setup(options, nuxt) {
    const resolver = createResolver(import.meta.url)

    nuxt.hook('ready', () => {
      const nitro = useNitro()
      // Haz algo con la instancia de Nitro
    })
  }
})

Tipo

function useNitro (): Nitro

addServerPlugin

Agrega un plugin para extender el comportamiento en tiempo de ejecución de Nitro.

Puedes leer más sobre los plugins de Nitro en la documentación de Nitro.

Uso

import { createResolver, defineNuxtModule, addServerPlugin } from '@nuxt/kit'

export default defineNuxtModule({
  setup() {
    const { resolve } = createResolver(import.meta.url)
    addServerPlugin(resolve('./runtime/plugin.ts'))
  }
})

Tipo

function addServerPlugin (plugin: string): void

Parámetros

PropiedadTipoRequeridoDescripción
pluginstringtrueRuta al plugin. El plugin debe exportar una función predeterminada que acepte la instancia de Nitro como argumento.

Ejemplos

import { createResolver, defineNuxtModule, addServerPlugin } from '@nuxt/kit'

export default defineNuxtModule({
  setup() {
    const { resolve } = createResolver(import.meta.url)
    addServerPlugin(resolve('./runtime/plugin.ts'))
  }
})

addPrerenderRoutes

Agrega rutas para ser prerenderizadas por Nitro.

Uso

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

export default defineNuxtModule({
  meta: {
    name: 'nuxt-sitemap',
    configKey: 'sitemap',
  },
  defaults: {
    sitemapUrl: '/sitemap.xml',
    prerender: true,
  },
  setup(options) {
    if (options.prerender) {
      addPrerenderRoutes(options.sitemapUrl)
    }
  }
})

Tipo

function addPrerenderRoutes (routes: string | string[]): void

Parámetros

PropiedadTipoRequeridoDescripción
routesstring | string[]trueUna ruta o un array de rutas para prerenderizar.

addServerImportsDir

Agrega un directorio para ser escaneado para auto-importaciones por Nitro.

Uso

import { defineNuxtModule, createResolver, addServerImportsDir } from '@nuxt/kit'

export default defineNuxtModule({
  meta: {
    name: 'my-module',
    configKey: 'myModule',
  },
  setup(options) {
    const { resolve } = createResolver(import.meta.url)
    addServerImportsDir(resolve('./runtime/server/composables'))
  }
})

Tipo

function addServerImportsDir (dirs: string | string[], opts: { prepend?: boolean }): void

Parámetros

PropiedadTipoRequeridoDescripción
dirsstring | string[]trueUn directorio o un array de directorios para registrar para ser escaneados por Nitro.
opts{ prepend?: boolean }falseOpciones para el directorio de importación. Si prepend es true, el directorio se agrega al inicio de la lista de escaneo.

Ejemplos

Puedes usar addServerImportsDir para agregar un directorio para ser escaneado por Nitro. Esto es útil cuando deseas que Nitro autoimporte funciones desde un directorio de servidor personalizado.

import { defineNuxtModule, createResolver, addServerImportsDir } from '@nuxt/kit'

export default defineNuxtModule({
  meta: {
    name: 'my-module',
    configKey: 'myModule',
  },
  setup(options) {
    const { resolve } = createResolver(import.meta.url)
    addServerImportsDir(resolve('./runtime/server/composables'))
  }
})

Luego puedes usar la función useApiSecret en tu código de servidor:

runtime/server/api/hello.ts
const useApiSecret = (): string => ''
// ---cut---
export default defineEventHandler(() => {
  const apiSecret = useApiSecret()
  // Haz algo con el apiSecret
})

addServerScanDir

Agrega directorios para ser escaneados por Nitro. Verificará subdirectorios, que serán registrados al igual que la carpeta ~/server.

Solo se escanean ~/server/api, ~/server/routes, ~/server/middleware, y ~/server/utils.

Uso

import { defineNuxtModule, createResolver, addServerScanDir } from '@nuxt/kit'

export default defineNuxtModule({
  meta: {
    name: 'my-module',
    configKey: 'myModule',
  },
  setup(options) {
    const { resolve } = createResolver(import.meta.url)
    addServerScanDir(resolve('./runtime/server'))
  }
})

Tipo

function addServerScanDir (dirs: string | string[], opts: { prepend?: boolean }): void

Parámetros

PropiedadTipoRequeridoDescripción
dirsstring | string[]trueUn directorio o un array de directorios para registrar para ser escaneados por Nitro como directorios de servidor.
opts{ prepend?: boolean }falseOpciones para el directorio de importación. Si prepend es true, el directorio se agrega al inicio de la lista de escaneo.

Ejemplos

Puedes usar addServerScanDir para agregar un directorio para ser escaneado por Nitro. Esto es útil cuando deseas agregar un directorio de servidor personalizado.

import { defineNuxtModule, createResolver, addServerScanDir } from '@nuxt/kit'

export default defineNuxtModule({
  meta: {
    name: 'my-module',
    configKey: 'myModule',
  },
  setup(options) {
    const { resolve } = createResolver(import.meta.url)
    addServerScanDir(resolve('./runtime/server'))
  }
})

Luego puedes usar la función hello en tu código de servidor.

runtime/server/api/hello.ts
function hello() {
  return 'Hello from server utils!'
}
// ---cut---
export default defineEventHandler(() => {
  return hello() // Hello from server utils!
})