欢迎来到 Svelte 教程!这个教程将会涵盖用来轻松构建小巧、高效,任何规模的网页应用所需要了解的一切。
你也可以查看 API 文档 和 示例,或者,如果你已经急不可耐地想在你的电脑上大显身手了,你可以用 npm init svelte
来创建新项目。
Svelte 是什么?
Svelte 是一个用来构建网页应用的工具。就跟其他 UI 框架一样,它允许你用包含标签、样式和行为的 声明式 的组件来构建应用。
这些组件被 编译 成小型、高效的 JavaScript 模块,消除了传统上与 UI 框架相关的开销。
你可以只用 Svelte 来构建你的整个应用(比如用 SvelteKit 这样的应用框架,会在之后的教程涵盖),或者你也可以把它加入到已存在的代码库。你也可以只发布单独的组件以便在其他地方复用。
如何使用本教程
要理解 Svelte,你需要对 HTML、CSS 和 JavaScript 有一个基本的了解。
本教程主要分为四部分:
每篇教程都会有一个练习,用于展示所描述的功能。后一篇教程的练习会依赖前一篇教程中所学习的内容,所以推荐大家从前往后按顺序阅读。但是如果有需要,你也可以在上面的菜单栏中切换不同的教程。
如果你卡住了,可以点击编辑器左边编辑器视图右上角的 solve
按钮。(使用下方的开关切换教程视图和编辑器视图。像本篇教程一样不包括练习的话,solve
按钮是灰色的。)尽量不要太依赖这个按钮,你需要自己想办法理解每段代码该写在哪个地方,自己动手在编辑器里修改代码,这样才能学得快。