Nitro
Nitro 是一个开源的 TypeScript 框架,用于构建超快速的 Web 服务器。Nuxt 使用 Nitro 作为其服务端引擎。你可以使用 useNitro 来访问 Nitro 实例,使用 addServerHandler 来添加服务端处理程序,使用 addDevServerHandler 来添加仅在开发模式下使用的服务端处理程序,使用 addServerPlugin 来添加插件以扩展 Nitro 的运行时行为,以及使用 addPrerenderRoutes 来添加由 Nitro 预渲染的路由。
addServerHandler
添加一个 Nitro 服务端处理程序。如果你想创建服务端中间件或自定义路由,请使用此项。
使用
import { addServerHandler, createResolver, defineNuxtModule } from '@nuxt/kit'
export default defineNuxtModule({
setup (options) {
const { resolve } = createResolver(import.meta.url)
addServerHandler({
route: '/robots.txt',
handler: resolve('./runtime/robots.get'),
})
},
})
类型
function addServerHandler (handler: NitroEventHandler): void
参数
handler:一个包含以下属性的处理程序对象
| 属性 | 类型 | 必需 | 描述 |
|---|---|---|---|
handler | string | true | 事件处理程序的路径。 |
route | string | false | 路径前缀或路由。如果使用空字符串,它将被用作中间件。 |
middleware | boolean | false | 指定这是一个中间件处理程序。中间件会在每个路由上被调用,通常不应返回任何内容,以便传递给后续的处理程序。 |
lazy | boolean | false | 使用懒加载来导入处理程序。当你只想在需要时加载处理程序时,这很有用。 |
method | string | false | 路由方法匹配器。如果处理程序名称包含方法名称,它将被用作默认值。 |
示例
基本用法
你可以使用 addServerHandler 从你的模块中添加服务端处理程序。
import { addServerHandler, createResolver, defineNuxtModule } from '@nuxt/kit'
export default defineNuxtModule({
setup (options) {
const { resolve } = createResolver(import.meta.url)
addServerHandler({
route: '/robots.txt',
handler: resolve('./runtime/robots.get'),
})
},
})
export default defineEventHandler(() => {
return {
body: `User-agent: *\nDisallow: /`,
}
})
当你访问 /robots.txt 时,它将返回以下响应
User-agent: *
Disallow: /
addDevServerHandler
添加一个仅在开发模式下使用的 Nitro 服务端处理程序。该处理程序将被排除在生产环境构建之外。
使用
import { defineEventHandler } from 'h3'
import { addDevServerHandler, createResolver, defineNuxtModule } from '@nuxt/kit'
export default defineNuxtModule({
setup () {
addDevServerHandler({
handler: defineEventHandler(() => {
return {
body: `Response generated at ${new Date().toISOString()}`,
}
}),
route: '/_handler',
})
},
})
类型
// @errors: 2391
import type { NitroDevEventHandler } from 'nitropack/types'
// ---cut---
function addDevServerHandler (handler: NitroDevEventHandler): void
参数
handler:一个包含以下属性的处理程序对象
| 属性 | 类型 | 必需 | 描述 |
|---|---|---|---|
handler | EventHandler | true | 事件处理程序。 |
route | string | false | 路径前缀或路由。如果使用空字符串,它将被用作中间件。 |
示例
基本用法
在某些情况下,你可能需要专门为开发目的创建服务端处理程序,例如 Tailwind 配置查看器。
import { joinURL } from 'ufo'
import { addDevServerHandler, defineNuxtModule } from '@nuxt/kit'
export default defineNuxtModule({
async setup (options, nuxt) {
const route = joinURL(nuxt.options.app?.baseURL, '/_tailwind')
// @ts-expect-error - tailwind-config-viewer does not have correct types
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
返回 Nitro 实例。
ready 钩子之后调用 useNitro()。使用
import { defineNuxtModule, useNitro } from '@nuxt/kit'
export default defineNuxtModule({
setup (options, nuxt) {
const resolver = createResolver(import.meta.url)
nuxt.hook('ready', () => {
const nitro = useNitro()
// Do something with Nitro instance
})
},
})
类型
function useNitro (): Nitro
addServerPlugin
添加插件以扩展 Nitro 的运行时行为。
nitropack/runtime 显式导入 defineNitroPlugin。同样的要求也适用于像 useRuntimeConfig 这样的工具。使用
import { addServerPlugin, createResolver, defineNuxtModule } from '@nuxt/kit'
export default defineNuxtModule({
setup () {
const { resolve } = createResolver(import.meta.url)
addServerPlugin(resolve('./runtime/plugin.ts'))
},
})
类型
function addServerPlugin (plugin: string): void
参数
| 属性 | 类型 | 必需 | 描述 |
|---|---|---|---|
plugin | string | true | 插件路径。该插件必须导出一个接受 Nitro 实例作为参数的默认函数。 |
示例
import { addServerPlugin, createResolver, defineNuxtModule } from '@nuxt/kit'
export default defineNuxtModule({
setup () {
const { resolve } = createResolver(import.meta.url)
addServerPlugin(resolve('./runtime/plugin.ts'))
},
})
export default defineNitroPlugin((nitroApp) => {
nitroApp.hooks.hook('request', (event) => {
console.log('on request', event.path)
})
nitroApp.hooks.hook('beforeResponse', (event, { body }) => {
console.log('on response', event.path, { body })
})
nitroApp.hooks.hook('afterResponse', (event, { body }) => {
console.log('on after response', event.path, { body })
})
})
addPrerenderRoutes
将路由添加到 Nitro 以进行预渲染。
使用
import { addPrerenderRoutes, defineNuxtModule } 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)
}
},
})
类型
function addPrerenderRoutes (routes: string | string[]): void
参数
| 属性 | 类型 | 必需 | 描述 |
|---|---|---|---|
routes | string | string[] | true | 要预渲染的路由或路由数组。 |
addServerImports
向服务端添加导入。它使你的导入在 Nitro 中可用,而无需手动导入它们。
shared/ 目录中使用的工具,该函数必须从相同的源文件导入给 addImports 和 addServerImports,并具有相同的签名。该源文件不应导入任何特定于上下文的内容(例如 Nitro 上下文、Nuxt 应用上下文),否则在类型检查期间可能会导致错误。使用
import { addServerImports, createResolver, defineNuxtModule } from '@nuxt/kit'
export default defineNuxtModule({
setup (options) {
const names = [
'useStoryblok',
'useStoryblokApi',
'useStoryblokBridge',
'renderRichText',
'RichTextSchema',
]
names.forEach(name =>
addServerImports({ name, as: name, from: '@storyblok/vue' }),
)
},
})
类型
function addServerImports (dirs: Import | Import[]): void
参数
imports:一个包含以下属性的对象或对象数组
| 属性 | 类型 | 必需 | 描述 |
|---|---|---|---|
name | string | true | 要检测的导入名称。 |
from | string | true | 要导入的模块标识符。 |
priority | number | false | 导入的优先级;如果多个导入具有相同的名称,将使用优先级最高的那个。 |
disabled | boolean | false | 此导入是否已禁用。 |
meta | Record<string, any> | false | 导入的元数据。 |
类型 | boolean | false | 此导入是否为纯类型导入。 |
typeFrom | string | false | 生成类型声明时,将此值用作 from 的值。 |
as | string | false | 以此名称导入。 |
addServerImportsDir
添加一个由 Nitro 扫描以进行自动导入的目录。
使用
import { addServerImportsDir, createResolver, defineNuxtModule } 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'))
},
})
类型
function addServerImportsDir (dirs: string | string[], opts: { prepend?: boolean }): void
参数
| 属性 | 类型 | 必需 | 描述 |
|---|---|---|---|
dirs | string | string[] | true | 要注册并由 Nitro 扫描的目录或目录数组。 |
opts | { prepend?: boolean } | false | 导入目录的选项。如果 prepend 为 true,则该目录将添加到扫描列表的最前面。 |
示例
你可以使用 addServerImportsDir 添加一个由 Nitro 扫描的目录。当你希望 Nitro 从自定义服务端目录自动导入函数时,这非常有用。
import { addServerImportsDir, createResolver, defineNuxtModule } 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'))
},
})
export function useApiSecret () {
const { apiSecret } = useRuntimeConfig()
return apiSecret
}
然后,你可以在你的服务端代码中使用 useApiSecret 函数
const useApiSecret = (): string => ''
// ---cut---
export default defineEventHandler(() => {
const apiSecret = useApiSecret()
// Do something with the apiSecret
})
addServerScanDir
添加由 Nitro 扫描的目录。它将检查子目录,这些子目录将被注册,就像 ~~/server 文件夹一样。
~~/server/api、~~/server/routes、~~/server/middleware 和 ~~/server/utils。使用
import { addServerScanDir, createResolver, defineNuxtModule } from '@nuxt/kit'
export default defineNuxtModule({
meta: {
name: 'my-module',
configKey: 'myModule',
},
setup (options) {
const { resolve } = createResolver(import.meta.url)
addServerScanDir(resolve('./runtime/server'))
},
})
类型
function addServerScanDir (dirs: string | string[], opts: { prepend?: boolean }): void
参数
| 属性 | 类型 | 必需 | 描述 |
|---|---|---|---|
dirs | string | string[] | true | 要注册并由 Nitro 扫描为服务端目录的目录或目录数组。 |
opts | { prepend?: boolean } | false | 导入目录的选项。如果 prepend 为 true,则该目录将添加到扫描列表的最前面。 |
示例
你可以使用 addServerScanDir 添加一个由 Nitro 扫描的目录。当你想要添加自定义服务端目录时,这非常有用。
import { addServerScanDir, createResolver, defineNuxtModule } from '@nuxt/kit'
export default defineNuxtModule({
meta: {
name: 'my-module',
configKey: 'myModule',
},
setup (options) {
const { resolve } = createResolver(import.meta.url)
addServerScanDir(resolve('./runtime/server'))
},
})
export function hello () {
return 'Hello from server utils!'
}
然后,你可以在你的服务端代码中使用 hello 函数。
function hello () {
return 'Hello from server utils!'
}
// ---cut---
export default defineEventHandler(() => {
return hello() // Hello from server utils!
})