Nitro
Nitro 是一个开源的 TypeScript 框架,用于构建超快速的 Web 服务器。Nuxt 使用 Nitro 作为其服务器引擎。你可以使用 useNitro
访问 Nitro 实例,addServerHandler
添加服务器处理器,addDevServerHandler
添加仅在开发模式下使用的服务器处理器,addServerPlugin
添加插件以扩展 Nitro 的运行时行为,以及 addPrerenderRoutes
添加要由 Nitro 预渲染的路由。
addServerHandler
添加一个 Nitro 服务器处理器。如果你想创建服务器中间件或自定义路由,可以使用此函数。
用法
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')
})
}
})
类型
function addServerHandler (handler: NitroEventHandler): void
参数
handler:一个具有以下属性的处理器对象:
属性 | 类型 | 是否必需 | 描述 |
---|---|---|---|
handler | string | true | 事件处理器的路径。 |
route | string | false | 路径前缀或路由。如果使用空字符串,将用作中间件。 |
middleware | boolean | false | 指定这是一个中间件处理器。中间件在每个路由上都会被调用,通常应该不返回任何内容以传递给下一个处理器。 |
lazy | boolean | false | 使用懒加载来导入处理器。当你只想在需要时加载处理器时,这很有用。 |
method | string | false | 路由器方法匹配器。如果处理器名称包含方法名称,它将被用作默认值。 |
示例
基本用法
你可以使用 addServerHandler
从你的模块中添加一个服务器处理器。
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')
})
}
})
export default defineEventHandler(() => {
return {
body: `User-agent: *\nDisallow: /`
}
})
当你访问 /robots.txt
时,它将返回以下响应:
User-agent: *
Disallow: /
addDevServerHandler
添加一个仅在开发模式下使用的 Nitro 服务器处理器。此处理器将被排除在生产构建之外。
用法
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'
})
}
})
类型
function addDevServerHandler (handler: NitroDevEventHandler): void
参数
handler:一个具有以下属性的处理器对象:
属性 | 类型 | 是否必需 | 描述 |
---|---|---|---|
handler | EventHandler | true | 事件处理器。 |
route | string | false | 路径前缀或路由。如果使用空字符串,将用作中间件。 |
示例
基本用法
在某些情况下,你可能希望创建专门用于开发目的的服务器处理器,例如 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
返回 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()
// 对 Nitro 实例执行一些操作
})
}
})
类型
function useNitro (): Nitro
addServerPlugin
添加插件以扩展 Nitro 的运行时行为。
用法
import { createResolver, defineNuxtModule, addServerPlugin } 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 { createResolver, defineNuxtModule, addServerPlugin } 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("请求时", event.path);
});
nitroApp.hooks.hook("beforeResponse", (event, { body }) => {
console.log("响应前", event.path, { body });
});
nitroApp.hooks.hook("afterResponse", (event, { body }) => {
console.log("响应后", event.path, { body });
});
});
addPrerenderRoutes
添加要由 Nitro 预渲染的路由。
用法
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)
}
}
})
类型
function addPrerenderRoutes (routes: string | string[]): void
参数
属性 | 类型 | 是否必需 | 描述 |
---|---|---|---|
routes | string | string[] | true | 要预渲染的一个路由或路由数组。 |
addServerImports
向服务器添加导入。它使你的导入在 Nitro 中可用,而无需手动导入它们。
用法
import { defineNuxtModule, createResolver, addServerImports } 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 | 导入的元数据。 |
type | boolean | false | 此导入是否是纯类型导入。 |
typeFrom | string | false | 生成类型声明时使用此值作为 from 值。 |
as | string | false | 以此名称导入。 |
addServerImportsDir
添加一个目录,供 Nitro 扫描自动导入。
用法
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'))
}
})
类型
function addServerImportsDir (dirs: string | string[], opts: { prepend?: boolean }): void
参数
属性 | 类型 | 是否必需 | 描述 |
---|---|---|---|
dirs | string | string[] | true | 要注册供 Nitro 扫描的一个目录或目录数组。 |
opts | { prepend?: boolean } | false | 导入目录的选项。如果 prepend 为 true ,则该目录被添加到扫描列表的开头。 |
示例
你可以使用 addServerImportsDir
添加一个供 Nitro 扫描的目录。当你希望 Nitro 从自定义服务器目录自动导入函数时,这很有用。
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'))
}
})
export function useApiSecret() {
const { apiSecret } = useRuntimeConfig()
return apiSecret
}
然后你可以在服务器代码中使用 useApiSecret
函数:
export default defineEventHandler(() => {
const apiSecret = useApiSecret()
// 对 apiSecret 执行一些操作
})
addServerScanDir
添加要由 Nitro 扫描的目录。它将检查子目录,这些子目录将像 ~/server
文件夹一样被注册。
~/server/api
、~/server/routes
、~/server/middleware
和 ~/server/utils
。用法
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'))
}
})
类型
function addServerScanDir (dirs: string | string[], opts: { prepend?: boolean }): void
参数
属性 | 类型 | 是否必需 | 描述 |
---|---|---|---|
dirs | string | string[] | true | 要注册供 Nitro 作为服务器目录扫描的一个目录或目录数组。 |
opts | { prepend?: boolean } | false | 导入目录的选项。如果 prepend 为 true ,则该目录被添加到扫描列表的开头。 |
示例
你可以使用 addServerScanDir
添加一个供 Nitro 扫描的目录。当你想要添加自定义服务器目录时,这很有用。
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'))
}
})
export function hello() {
return 'Hello from server utils!'
}
然后你可以在服务器代码中使用 hello
函数。
export default defineEventHandler(() => {
return hello() // Hello from server utils!
})