簡介
Nuxt 是一個免費且開源的框架，它以直觀且可擴展的方式，使用 Vue.js 創建類型安全、高效能和生產級的全端 Web 應用程式和網站。
我們完成了一切準備工作，讓您可以從一開始就撰寫 .vue 檔案，同時在開發中享受熱模組替換，並在生產環境中預設使用伺服器端渲染，獲得高效能的應用程式。
Nuxt 沒有供應商鎖定，讓您可以將您的應用程式部署到任何地方，甚至在邊緣運算。
自動化與慣例
Nuxt 使用慣例和有主見的目錄結構來自動化重複性任務，並讓開發人員專注於推進功能。設定檔仍然可以自訂和覆蓋其預設行為。
- 基於檔案的路由： 根據您的
pages/目錄結構定義路由。這可以更輕鬆地組織您的應用程式，並避免手動路由設定的需求。 - 程式碼分割： Nuxt 會自動將您的程式碼分割成更小的區塊，這有助於減少應用程式的初始載入時間。
- 開箱即用的伺服器端渲染： Nuxt 內建 SSR 功能，因此您不必自行設定單獨的伺服器。
- 自動匯入： 將 Vue composable 和元件寫在各自的目錄中，並使用它們，而無需匯入它們，並享有 tree-shaking 和最佳化 JS 套件的優勢。
- 資料獲取工具： Nuxt 提供 composable 來處理與 SSR 相容的資料獲取以及不同的策略。
- 零配置 TypeScript 支援： 使用我們自動產生的類型和
tsconfig.json撰寫類型安全程式碼，而無需學習 TypeScript。 - 已配置的建置工具： 我們預設使用 Vite 來支援開發中的熱模組替換 (HMR)，並將您的程式碼與內建的最佳實踐打包以用於生產環境。
Nuxt 負責處理這些，並提供前端和後端功能，讓您可以專注於重要的事項：創建您的 Web 應用程式。
伺服器端渲染
Nuxt 預設內建伺服器端渲染 (SSR) 功能，無需自行設定伺服器，這對 Web 應用程式有很多好處
- 更快的初始頁面載入時間： Nuxt 將完全渲染的 HTML 頁面傳送到瀏覽器，可以立即顯示。這可以提供更快的感知頁面載入時間和更好的使用者體驗 (UX)，尤其是在較慢的網路或裝置上。
- 改善 SEO： 搜尋引擎可以更好地索引 SSR 頁面，因為 HTML 內容是立即可用的，而不是需要 JavaScript 在客戶端渲染內容。
- 在低功耗裝置上具有更好的效能： 它減少了需要在客戶端下載和執行的 JavaScript 數量，這對於可能難以處理繁重 JavaScript 應用程式的低功耗裝置可能是有益的。
- 更好的可訪問性： 內容在初始頁面載入時立即可用，從而提高了依賴螢幕閱讀器或其他輔助技術的使用者的可訪問性。
- 更輕鬆的快取： 頁面可以在伺服器端快取，這可以通過減少產生內容並將其發送到客戶端所需的時間來進一步提高效能。
總體而言，伺服器端渲染可以提供更快、更有效的使用者體驗，並改善搜尋引擎最佳化和可訪問性。
由於 Nuxt 是一個多功能的框架，它讓您可以選擇使用 nuxt generate 將整個應用程式靜態渲染到靜態託管，使用 ssr: false 選項全局停用 SSR，或通過設定 routeRules 選項來利用混合渲染。
伺服器引擎
Nuxt 伺服器引擎 Nitro 解鎖了新的全端功能。
在開發中，它使用 Rollup 和 Node.js workers 來處理您的伺服器程式碼和上下文隔離。它還通過讀取 server/api/ 中的檔案和 server/middleware/ 中的伺服器中介軟體來產生您的伺服器 API。
在生產環境中，Nitro 將您的應用程式和伺服器建置到一個通用的 .output 目錄中。此輸出很輕巧：已最小化並從任何 Node.js 模組中移除（polyfill 除外）。您可以將此輸出部署到任何支援 JavaScript 的系統上，從 Node.js、Serverless、Workers、邊緣伺服器渲染或純靜態。
生產就緒
Nuxt 應用程式可以部署在 Node 或 Deno 伺服器上，預先渲染以託管在靜態環境中，或部署到無伺服器和邊緣供應商。
模組化
模組系統允許使用自訂功能和與第三方服務的整合來擴展 Nuxt。
架構
Nuxt 由不同的核心套件組成
- 核心引擎：nuxt
- 打包器：@nuxt/vite-builder 和 @nuxt/webpack-builder
- 命令列介面：nuxi
- 伺服器引擎：nitro
- 開發套件：@nuxt/kit
我們建議閱讀每個概念，以全面了解 Nuxt 的功能和每個套件的範圍。