Astro 教程简介

欢迎来到 Astro 教程!

什么是 Astro?

Astro 是一个为内容驱动的网站(如博客、营销网站、文档等)设计的集一体化(All-in-One)现代 Web 框架。

它最核心的优势在于群岛架构(Island Architecture)

  • 默认 0 JS:Astro 默认在构建时移除所有未被明确标记为“需要水合(Hydration)”的客户端 JavaScript。
  • 框架无关:在同一个 Astro 页面中,你可以混用 React、Vue、Svelte 甚至是 Solid 组件。
  • 极速性能:得益于极少的客户端 JS 和高度优化的 HTML 产物,Astro 的首屏加载速度极快。
  • 灵活的渲染策略:同时支持 SSG(静态站点生成)和 SSR(服务端渲染)。

本教程将包含什么?

本教程旨在带你快速入门 Astro,并涵盖以下内容:

  1. Astro 项目的创建与目录结构解析
  2. Astro 组件(.astro 文件)的基本语法与使用
  3. 什么是“Astro 群岛”以及如何引入 React/Vue 等 UI 框架组件
  4. 内容集合(Content Collections)与基于 Markdown/MDX 的博客搭建
  5. 路由系统与构建发布

本文为轻叶全栈手册原创内容,转载请注明出处。