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:
Propiedad | Tipo | Requerido | Descripción |
---|---|---|---|
handler | string | true | Ruta al manejador de eventos. |
route | string | false | Prefijo de ruta o ruta. Si se usa una cadena vacía, se usará como middleware. |
middleware | boolean | false | Especifica 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. |
lazy | boolean | false | Usa carga diferida para importar el manejador. Esto es útil cuando solo deseas cargar el manejador bajo demanda. |
method | string | false | Coincidencia 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:
Propiedad | Tipo | Requerido | Descripción |
---|---|---|---|
handler | EventHandler | true | Manejador de eventos. |
route | string | false | Prefijo 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
Propiedad | Tipo | Requerido | Descripción |
---|---|---|---|
plugin | string | true | Ruta 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
Propiedad | Tipo | Requerido | Descripción |
---|---|---|---|
routes | string | string[] | true | Una 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
Propiedad | Tipo | Requerido | Descripción |
---|---|---|---|
dirs | string | string[] | true | Un directorio o un array de directorios para registrar para ser escaneados por Nitro. |
opts | { prepend?: boolean } | false | Opciones 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:
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
Propiedad | Tipo | Requerido | Descripción |
---|---|---|---|
dirs | string | string[] | true | Un directorio o un array de directorios para registrar para ser escaneados por Nitro como directorios de servidor. |
opts | { prepend?: boolean } | false | Opciones 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.
function hello() {
return 'Hello from server utils!'
}
// ---cut---
export default defineEventHandler(() => {
return hello() // Hello from server utils!
})
※Esta página es una traducción no oficial de la documentación oficial de Nuxt.js.
La página correspondiente en la documentación oficial está aquí:
https://nuxt.com/docs/3.x/api/kit/nitro