透過 100+ 個提示的集合學習 Nuxt!

直觀的
Vue 框架

Nuxt 是一個 開源框架 ,讓網頁開發變得直觀且強大。
自信地建立高效能、產品級的全端 Web 應用程式和網站。
開始使用

受到最優秀前端團隊的信任

強大的
Vue 元件

我們和您一樣熱愛 Vue 單文件元件。簡單、直觀且強大,Nuxt 讓您以合理的方式撰寫 Vue 元件。每個重複的任務都會自動化,因此您可以專注於自信地撰寫您的全端 Vue 應用程式。
app.vue
<script setup>
useSeoMeta({
  title: 'Meet Nuxt',
  description: 'The Intuitive Vue Framework.'
})
</script>

<template>
  <div id="app">
    <AppHeader />
    <NuxtPage />
    <AppFooter />
  </div>
</template>

<style>
#app {
  background-color: #020420;
  color: #00DC82;
}
</style>

靜態或動態,
選擇權在您

在路由層級決定您需要的渲染策略。透過利用混合渲染,您可以兩全其美:靜態網站的效能和動態網站的互動性。
<script setup>
// Pre-render the homepage at build time
defineRouteRules({
  prerender: true
})
</script>

<template>
  <div>
    <h1>Homepage</h1>
    <p>Pre-rendered at build time</p>
  </div>
</template>

組合您所需的
一切。

路由 & 版面配置

基於檔案的路由系統,以強大且傳統的方式建構複雜的檢視和介面。

資料提取

可在伺服器上執行的 Composable,為您的元件提取資料,並讓您以不同的方式渲染內容。

資源 & 樣式

圖片、字型和腳本最佳化,內建支援 CSS 模組、Sass、PostCSS、CSS-in-JS 等。

SEO & Meta 標籤

產品級且可被搜尋引擎索引,同時為終端使用者提供應用程式的感覺。

中介軟體

在渲染頁面或一組頁面之前執行自訂程式碼,例如驗證、本地化或 A/B 測試。

狀態管理

Nuxt 提供一種簡單的方式,在元件之間共用反應式且支援 SSR 的狀態。

轉場效果

透過內建支援 Vue 和瀏覽器轉場效果,在版面配置、頁面和元件之間建立平滑的轉場效果。

錯誤處理

內建錯誤處理和記錄,幫助您除錯應用程式並提供更好的使用者體驗。

圖層

使用另一個 Nuxt 應用程式擴充您的 Nuxt 應用程式,以重複使用元件、Composable、版面配置、頁面等。

伺服器路由

建立 API 端點和伺服器路由,以安全地連接第三方服務並從您的前端取用。

自動匯入

Nuxt 自動匯入助手、Composable 和 Vue API,以便在您的應用程式中使用,而無需明確匯入它們。

TypeScript

Nuxt 提供有用的快捷方式,以確保您在編碼時可以存取準確的類型資訊。

透過
無盡的整合,更快地交付

與您最喜愛的工具和服務整合。Nuxt 的設計具有彈性,並且可以透過強大的模組生態系統進行擴充。只需一行程式碼即可將您的應用程式與流行的無頭 CMS、電子商務、資料庫或 UI/UX 程式庫連接。
NetlifyNuxtHubVercelHerokuCloudflareAmplifyDigitalOceanTailwind CSSSupabaseStripeFirebaseStrapiWordPressDirectusStoryblokSanitySentryShopifyMeilisearchAlgolia

由來自世界各地的
開發人員構建。

Nuxt 及其生態系統的開發由一個國際團隊領導。從貢獻者到開發人員倡導者,該社群由來自不同領域和技能的成員組成。我們很高興每天看到新成員,並鼓勵任何人加入我們並以多種方式提供幫助:回答問題、發表演講、建立模組和為核心做出貢獻。

受到
全球網路的信任。

Nuxt 提供了一個引人注目的解決方案和一個強大的生態系統,可幫助您交付高效能且對 SEO 友好的全端 Vue 應用程式。在 SSR 和 SSG 之間進行選擇的靈活性是錦上添花。
Evan You

Evan You

Vue.js 和 Vite 的創建者

Nuxt 對於在網路上構建產品級產品的團隊來說是一個絕佳的選擇。它的目標是在保持出色的 Vue.js 開發者體驗的同時,融入效能最佳實務。
Addy Osmani

Addy Osmani

Chrome 的首席工程師

Nuxt 一直是開發人員和框架作者創新和靈感的來源。看到它在網路上各種規模的網頁專案中成長,真是太棒了。
Guillermo Rauch

Guillermo Rauch

Vercel 的共同創辦人和執行長

Nuxt 具有出色的開發人員生產力、體驗和開箱即用的效能!它對細節的關注如此之多,確保團隊擁有觸手可及的一切,以便有效地構建各種應用程式。
Sarah Drasner

Sarah Drasner

Google 工程總監

Nuxt 採用獨特的方法,將出色的開發人員體驗與可重複使用、完全整合的功能結合在一起,從而加速您下一個網站或應用程式的開發和效能。
Dominik Angerer

Dominik Angerer

Storyblok 的共同創辦人

我第一次使用 Nuxt 時就愛上了它。除了它的可擴展性、效能和開發人員體驗之外,它背後的團隊也很棒。感謝您開發出如此出色的框架,讓我們的生活更加輕鬆!
Savas Vedova

Savas Vedova

GitLab 的資深前端工程師

Nuxt 將高效能和專注的開發人員體驗相結合,這是一個遊戲規則改變者。它的 SSR 和 SSG 靈活性,加上與 Vue.js 生態系統一樣充滿活力的社群,使其成為現代網頁專案的絕佳選擇。
Rijk van Zanten

Rijk van Zanten

Directus 的技術長