透過 100 多個技巧學習 Nuxt!

伺服器

使用 Nuxt 的伺服器框架建構全端應用程式。您可以從資料庫或其他伺服器獲取資料、建立 API,甚至產生靜態伺服器端內容,例如網站地圖或 RSS Feed - 所有這些都來自單一程式碼庫。
文件 > 指南 > 目錄結構 > 伺服器 中閱讀更多內容。

由 Nitro 提供技術支援

Server engine

Nuxt 的伺服器是 Nitro。它最初是為 Nuxt 建立的,但現在是 UnJS 的一部分,並對其他框架開放 - 甚至可以單獨使用。

使用 Nitro 賦予 Nuxt 超能力

  • 完全掌控應用程式的伺服器端部分
  • 在任何供應商上通用部署 (許多零配置)
  • 混合式渲染

Nitro 內部使用 h3,這是一個為高效能和可移植性而建構的最小 H(TTP) 框架。

觀看 Alexander Lichter 的影片,以了解 Nuxt 和 Nitro 在您的應用程式中的職責。

伺服器端點 & 中介軟體

您可以輕鬆管理 Nuxt 應用程式中僅限伺服器端的部分,從 API 端點到中介軟體。

端點和中介軟體都可以像這樣定義

server/api/test.ts
export default 
defineEventHandler
(async (
event
) => {
// ... Do whatever you want here })

您可以直接傳回 textjsonhtml 甚至 stream

開箱即用,它支援熱模組替換自動匯入,就像 Nuxt 應用程式的其他部分一樣。

文件 > 指南 > 目錄結構 > 伺服器 中閱讀更多內容。

通用部署

Nitro 提供了將您的 Nuxt 應用程式部署到任何地方的能力,從裸機伺服器到邊緣網路,啟動時間僅需幾毫秒。速度真快!

部落格 > Nuxt On The Edge 中閱讀更多內容。

有超過 15 個預設,可為不同的雲端供應商和伺服器建構您的 Nuxt 應用程式,包括

或用於其他執行環境

Deno

Bun

文件 > 開始使用 > 部署 中閱讀更多內容。

混合式渲染

Nitro 有一個強大的功能叫做 routeRules,它允許您定義一組規則來自訂 Nuxt 應用程式中每個路由的渲染方式 (以及更多)。

nuxt.config.ts
export default 
defineNuxtConfig
({
routeRules
: {
// Generated at build time for SEO purpose '/': {
prerender
: true },
// Cached for 1 hour '/api/*': {
cache
: {
maxAge
: 60 * 60 } },
// Redirection to avoid 404 '/old-page': {
redirect
: {
to
: '/new-page',
statusCode
: 302 }
} // ... } })
了解所有可用的路由規則,以自訂路由的渲染模式。

此外,還有一些特定於 Nuxt 的路由規則 (例如,ssrappMiddlewarenoScripts) 可以更改將頁面渲染為 HTML 時的行為。

某些路由規則 (appMiddlewareredirectprerender) 也會影響用戶端行為。

Nitro 用於建構應用程式以進行伺服器端渲染以及預先渲染。

文件 > 指南 > 概念 > 渲染 中閱讀更多內容。