从 SvelteKit 迁移
SvelteKit 是一个在 Svelte 之上构建 Web 应用的框架。
¥SvelteKit is a framework for building web applications on top of Svelte.
SvelteKit 和 Astro 之间的主要相似之处
Section titled SvelteKit 和 Astro 之间的主要相似之处¥Key Similarities between SvelteKit and Astro
SvelteKit 和 Astro 有一些相似之处,可以帮助你迁移项目:
¥SvelteKit and Astro share some similarities that will help you migrate your project:
-
SvelteKit 和 Astro 都是现代 JavaScript 静态站点生成器和服务器端渲染框架。
-
SvelteKit 和 Astro 都使用 项目文件的
src/
文件夹 和 用于基于文件的路由的特殊文件夹。为你的网站创建和管理页面应该感觉很熟悉。 -
Astro 有 使用 Svelte 组件的官方集成 并支持 安装 NPM 包,其中包括一些针对 Svelte 的。你将能够编写 Svelte UI 组件,并且可能能够保留部分或全部现有组件和依赖。
-
Astro 和 SvelteKit 都允许你使用 用于数据的无头 CMS、API 或 Markdown 文件。你可以继续使用你喜欢的内容创作系统,并能够保留现有内容。
SvelteKit 和 Astro 之间的主要区别
Section titled SvelteKit 和 Astro 之间的主要区别¥Key Differences between SvelteKit and Astro
当你在 Astro 中重建 SvelteKit 站点时,你会注意到一些重要的差异:
¥When you rebuild your SvelteKit site in Astro, you will notice some important differences:
-
Astro 网站是多页面应用,而 SvelteKit 默认为具有服务器端渲染的 SPA(单页面应用),但也可以创建 MPA、传统 SPA,或者你可以在应用中混合和匹配这些技术。
-
组件:SvelteKit 使用 Svelte。Astro 页面是使用
.astro
组件 构建的,但也可以支持 React、Preact、Vue.js、Svelte、SolidJS、AlpineJS、Lit 和原始 HTML 模板。 -
content-driven:Astro 旨在展示你的内容并允许你仅根据需要选择加入交互。现有的 SvelteKit 应用可能是为高客户端交互性而构建的。Astro 具有处理内容的内置功能,例如页面生成,但可能需要高级的 Astro 技术来包含使用
.astro
组件复制更具挑战性的项目,例如仪表板。 -
Markdown 就绪:Astro 包括内置的 Markdown 支持,并包括用于每个文件的 特殊 frontmatter YAML
layout
属性 页面模板。如果你要转换基于 SvelteKit Markdown 的博客,则无需安装单独的 Markdown 集成,也无需通过配置文件设置布局。你可以携带现有的 Markdown 文件,但你可能需要重新组织,因为 Astro 基于文件的路由不需要每个页面路由都有一个文件夹。
从 SvelteKit 切换到 Astro
Section titled 从 SvelteKit 切换到 Astro¥Switch from SvelteKit to Astro
要将 SvelteKit 博客转换为 Astro,请从我们的博客主题入门模板开始,或在我们的 主题展示 中探索更多社区博客主题。
¥To convert a SvelteKit blog to Astro, start with our blog theme starter template, or explore more community blog themes in our theme showcase.
你可以将 --template
参数传递给 create astro
命令,以使用我们的官方启动器之一启动一个新的 Astro 项目。或者,你可以 从 GitHub 上任何现有的 Astro 存储库启动一个新项目。
¥You can pass a --template
argument to the create astro
command to start a new Astro project with one of our official starters. Or, you can start a new project from any existing Astro repository on GitHub.
将你现有的 Markdown(或 MDX,带有我们的可选集成)文件作为内容添加到 创建 Markdown 或 MDX 页面。
¥Bring your existing Markdown (or MDX, with our optional integration) files as content to create Markdown or MDX pages.
虽然基于文件的路由和布局组件在 Astro 中类似,但你可能希望阅读 Astro 的项目结构 以了解文件应位于何处。
¥While file-based routing and layout components are similar in Astro, you may wish to read about Astro’s project structure to learn where files should be located.
要转换其他类型的网站,例如作品集或文档网站,请参阅 astro.new 上的更多官方入门模板。你将找到每个项目的 GitHub 存储库的链接,以及用于在 StackBlitz、CodeSandbox 和 Gitpod 在线开发环境中打开工作项目的一键链接。
¥To convert other types of sites, such as a portfolio or documentation site, see more official starter templates on astro.new. You’ll find a link to each project’s GitHub repository, as well as one-click links to open a working project in StackBlitz, CodeSandbox and Gitpod online development environments.
¥Community Resources
-
添加你自己的!