跳转到内容

从 Jekyll 迁移

Jekyll 是一个基于 Ruby 的静态站点生成器。

Jekyll 和 Astro 的主要相似之处

Jekyll 和 Astro 有一些相似之处,可以帮助你迁移项目:

  • Jekyll 和 Astro 都是静态站点生成器,通常用于创建博客。

  • Jekyll 和 Astro 都允许你使用 Markdown 和 HTML 书写内容。Jekyll 和 Astro 都为页面布局和未发布的草稿文章提供了一些特殊的 frontmatter YAML 属性。你可以继续在 Astro 中使用现有的 Markdown 文件。

  • Jekyll 和 Astro 都使用基于文件的路由从博客文章创建页面。Astro 为所有页面和文章提供了一个特殊的 src/pages/ 目录。Jekyll 使用一个类似的特殊文件夹 posts/ 来存放你的 Markdown 博客文章,但是你的网站页面可以存在其他地方。创建新的博客文章应该很熟悉。

Jekyll 和 Astro 的主要区别

当你在 Astro 中重建 Jekyll 网站时,你会注意到一些重要的差异:

  • 由于 Jekyll 主要是一个博客平台,因此一些内置的博客功能你可能需要在 Astro 中自己构建。或者选择一个包含这些功能的博客入门模板主题。例如 Jekyll 内置了对标签和类别的支持,你可以在一些 Astro 博客主题中找到这些,但这并不包括在最简单的 Astro 项目中。

  • Jekyll 使用 Liquid 模板来实现可重用的布局元素和模板。Astro 使用类似 JSX 的 .astro 文件作为模板和组件。任何 .astro 文件都可以是组件、布局或整个页面,并且可以导入和渲染任何其他 Astro 组件。你也可以使用其他 UI 框架组件(如 React、Svelte、Vue、Solid)以及项目中其他文件,例如 Markdown 或 MDX 的内容或元素进行构建。

从 Jekyll 切换到 Astro

要将 Jekyll 博客转换为 Astro,请从我们的博客主题启动器模板开始,或者在主题展示中探索更多社区博客主题。

你可以向 create astro 命令传递 --template 参数,以使用我们的官方启动器之一启动新的 Astro 项目。或者你可以从 GitHub 上任何现有的 Astro 项目启动一个新项目

Terminal window
npm create astro@latest -- --template blog

使用 Astro Markdown 布局代替 Liquid 模板,将现有的 Markdown 文件作为内容来创建 Markdown 页面

许多现有的 HTML 页面内容都可以转换为 Astro 页面,此外你还可以直接在 HTML 模板中使用变量、类似 JSX 的表达式和组件导入

Astro 没有接收占位符的 permalink 属性。如果希望保留现有的 URL 结构,可能需要阅读更多关于 Astro 页面路由的信息。或者考虑在 Netlify 这样的主机上设置重定向

要转换其他类型的网站,如作品集或文档网站,请参阅 astro.new 上的更多官方入门模板。你会找到每个项目的 GitHub 仓库的链接,以及在 StackBlitz、CodeSandbox 和 Gitpod 在线开发环境中一键打开一个工作项的链接。

要转换其他类型的网站,如作品集或文档网站,请参阅 astro.new 上的更多官方入门模板。你能找到每个项目的 GitHub 仓库链接,以及一键打开 StackBlitz、CodeSandbox 和 Gitpod 在线开发环境的链接。

社区资源

更多迁移指南