簡介

開始之前

如果您是 Svelte 或 SvelteKit 的新手，我們建議您查看互動式教學。

如果您遇到困難，請在 Discord 聊天室尋求幫助。

什麼是 SvelteKit？

SvelteKit 是一個框架，用於使用 Svelte 快速開發穩健、高效能的 Web 應用程式。如果您來自 React，SvelteKit 類似於 Next。如果您來自 Vue，SvelteKit 類似於 Nuxt。

若要深入瞭解您可以使用 SvelteKit 建置的應用程式類型，請參閱常見問題。

什麼是 Svelte？

簡而言之，Svelte 是一種編寫使用者介面元件（例如導覽列、評論區或聯絡表單）的方式，使用者可以在其瀏覽器中看到並與之互動。Svelte 編譯器會將您的元件轉換為 JavaScript，這些 JavaScript 可以執行以呈現頁面的 HTML，並轉換為 CSS，以設定頁面的樣式。您不需要瞭解 Svelte 就能理解本指南的其餘部分，但瞭解它會有幫助。如果您想瞭解更多資訊，請查看Svelte 教學。

SvelteKit vs Svelte

Svelte 呈現 UI 元件。您可以使用這些元件組合，並僅使用 Svelte 呈現整個頁面，但您需要的不僅僅是 Svelte 才能編寫整個應用程式。

SvelteKit 可協助您建置 Web 應用程式，同時遵循現代最佳實務，並為常見的開發挑戰提供解決方案。它提供了從基本功能（例如，當點擊連結時更新您的 UI 的路由器）到更進階的功能。其廣泛的功能列表包括建置最佳化，僅載入最少的必要程式碼；離線支援；在使用者導覽之前預先載入頁面；可設定的呈現，以透過SSR在伺服器上、透過用戶端呈現在瀏覽器中或在建置時透過預先呈現來處理應用程式的不同部分；圖片最佳化；以及更多功能。使用所有現代最佳實務建置應用程式非常複雜，但 SvelteKit 會為您完成所有枯燥的工作，讓您可以繼續進行創意部分。

它會立即在瀏覽器中反映程式碼的變更，透過使用具有Svelte 外掛程式的 Vite 來執行熱模組替換 (HMR)，從而提供快速且功能豐富的開發體驗。