Svelte 基礎(chǔ)

歡迎使用 Svelte 教程。這將教會(huì)您輕松構(gòu)建快速、小型 Web 應(yīng)用程序所需的一切知識(shí)。

您還可以查閱 API 文檔 和 示例，或者——如果您迫不及待地想在本地開始 —— 60 秒快速入門。

什么是 Svelte？

Svelte 是一種用于構(gòu)建快速 Web 應(yīng)用程序的工具。

它類似于 React 和 Vue 等 JavaScript 框架，它們的共同目標(biāo)是輕松構(gòu)建流暢的交互式用戶界面。

但有一個(gè)關(guān)鍵的區(qū)別：Svelte 在構(gòu)建時(shí)將您的應(yīng)用程序轉(zhuǎn)換為理想的 JavaScript，而不是在運(yùn)行時(shí)解釋您的應(yīng)用程序代碼。這意味著您無需支付框架抽象的性能成本，并且您的應(yīng)用程序首次加載時(shí)不會(huì)受到懲罰。

您可以使用 Svelte 構(gòu)建整個(gè)應(yīng)用程序，也可以將其增量添加到現(xiàn)有代碼庫(kù)中。您還可以將組件作為可在任何地方使用的獨(dú)立包進(jìn)行交付，而無需依賴傳統(tǒng)框架的開銷。

如何使用本教程

您需要對(duì) HTML、CSS 和 JavaScript 有基本的了解才能理解 Svelte。

在學(xué)習(xí)本教程的過程中，您將看到旨在說明新功能的小練習(xí)。后面的章節(jié)建立在前面章節(jié)中獲得的知識(shí)之上，因此建議您從頭到尾閱讀。

了解組件

在 Svelte 中，應(yīng)用程序由一個(gè)或多個(gè)組件組成。組件是一個(gè)可重復(fù)使用的獨(dú)立代碼塊，它封裝了屬于一起的 HTML、CSS 和 JavaScript，并寫入一個(gè) ?.svelte? 文件中。代碼編輯器中的“hello world”示例是一個(gè)簡(jiǎn)單的組件。

• App.svelte

<h1>Hello world!</h1>