Astro 入门指南

什么是 Astro？

Astro 是一个现代化的静态站点生成器，专注于内容网站的性能。详见 Astro 官网。

核心概念

群岛架构

Astro 的核心理念是「群岛架构」，详见 Astro Islands 文档：

1. 默认发送零 JavaScript
2. 仅在需要时水化互动组件
3. 支持多种 UI 框架（如 Vue、React、Svelte）

组件语法

---
// 这里是组件脚本（服务端运行）
const title = 'Hello, Astro!';
---

<!-- 这里是组件模板 -->
<h1>{title}</h1>

<style>
  /* 组件样式，作用域化 */
</style>

<script>
  // 客户端脚本
</script>

为什么选择 Astro？

特性	说明
零 JS 默认	默认不发送 JavaScript
框架无关	支持 React/Vue/Svelte
优秀的 DX	开发体验非常好
性能优秀	构建产物性能极佳

总结

Astro 是一个非常优秀的静态站点生成器，特别适合内容网站。