Astro启动器

astrogon — Astro 启动器模板

作者 astrogon

Astrogon 是基于 Astro、Tailwind 与少量 React 构建的多用途网站模板,内置博客、文档、食谱、作者、诗歌等多种内容集合与丰富的 MD/MDX 组件。

看看你的网站会是什么样

浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。

3 个预览视图
桌面端首页1 / 3
桌面端截图首屏预览

由服务器浏览器实际访问页面后截取。

全部页面与视图 3

截图用于了解视觉与布局,交互效果请以实际项目为准。

采集于 2026-10-02查看来源

值得关注的模板亮点

从已有项目资料中,快速了解它的特点。

01

基于 Astro 内容集合,内置博客、文档、食谱、作者、诗歌、索引卡片等多套示例集合

02

文档集合支持多级结构与可切换的文档浏览侧栏、目录侧栏

03

内容组件覆盖手风琴、标签页、代码块、引用块、提示块、YouTube 嵌入与 LaTeX 公式

04

支持亮色/暗色模式与系统偏好自动检测,并提供毛玻璃效果开关

05

包含搜索、面包屑、相关内容、阅读时长、分页与社交分享等站点级功能

06

MIT 许可,允许免费使用、修改、商用与分发该版本代码

模板详细介绍

Astrogon 是一个基于 Astro 的多用途网站模板,结合 Tailwind 与少量 React 组件,目标是提供可快速定制的站点骨架。它通过 Astro 内容集合组织内容,仓库中已包含博客(带分类与标签)、文档(多级结构、可切换的文档浏览侧栏与目录侧栏)、食谱(高度模板化结构)、作者(可通过 Author 字段跨集合关联条目)、诗歌(轻量集合,带分页)以及索引卡片(内容集中在单文件、单页展示)等示例集合,另附首页、关于/简介、作品集、条款与 404 页面。内容层面提供手风琴、标签页、带语法高亮的代码块、引用块、提示块(note/tip/info/warning)、YouTube 嵌入、LaTeX 行内与块级公式,以及脚注、表格等标准 MD/MDX 能力。站点层面支持亮色与暗色模式(含系统偏好自动检测)、对所选内容的搜索、自适应布局、工具提示、面包屑、自动填充的相关内容、自动计算的阅读时长、可切换的毛玻璃效果、配色与字体定制、组件过渡动画、分页、社交分享组件以及面向搜索引擎优化的内置模式。开发上建议使用 Git、Node Version Manager 与 Visual Studio Code;README 给出的流程是 fork 并克隆仓库、使用 Node 22、执行 npm install 后以 npm run dev 启动,本地地址为 http://localhost:4321,也可使用 npx astro build 与 npx wrangler dev。模板以 MIT 许可发布,但演示图片、字体、图标等第三方素材需单独核对许可,域名、托管等外部服务可能另行收费。

Astro启动器

适合你的项目吗?

适用场景

  • 搭建同时包含博客与文档的多用途内容站点
  • 需要分类、标签、分页与相关内容的写作型网站
  • 以 MD/MDX 为主、需要代码块、提示块与数学公式的技术内容展示
  • 希望以现成内容集合结构快速起步并逐项定制的 Astro 项目

适合人群

  • 熟悉 Astro 与 Tailwind、希望基于现成模板二次开发的开发者
  • 需要博客、文档、作品集等多种内容形态的个人或团队站点
  • 偏好 Markdown/MDX 写作并需要暗色模式与站内搜索的项目

上手与定制指南

结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。

  1. 1

    README 建议使用 Node 22,可通过 nvm install 22 或 nvm use 22 切换

  2. 2

    先 fork 并克隆仓库,再在项目目录执行 npm install 安装依赖

  3. 3

    使用 npm run dev 启动开发服务器,默认访问 http://localhost:4321

  4. 4

    如需部署到 Cloudflare,可改用 npx astro build 与 npx wrangler dev

  5. 5

    演示图片、字体、图标等第三方素材需按各自许可单独核对

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。

使用时需要遵守

  • 允许免费使用、修改、商用和分发该版本代码。
  • 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
  • 代码按现状提供;担保与责任限制以原许可证及适用法律为准。

额外费用与待核对事项

  • 若部署到 Cloudflare,需注意 Astro 5.8 起不再支持 Node 18,而旧版 Cloudflare Pages 默认使用 Node 18,因此需改用 Wrangler 与 Cloudflare Workers 方式部署。
  • README 建议先 fork 仓库到自己的 GitHub 账号再克隆到本地,属于推荐流程而非强制许可限制。
  • 项目完全免费开源,赞助为自愿捐赠,不构成使用限制或付费要求。
  • 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
  • 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
查看原文依据

Permission is hereby granted, free of charge

许可证原文

This is relevant if you intend to deploy your site to Cloudflare. Starting with Astro 5.8, Node 18 is unsupported, but the old Cloudflare Pages uses 18 by default. Wrangler appears to be necessary to use the new Cloudflare Workers.

README 原文

Fork this repository to your own GitHub account, then clone it to your local machine

README 原文

a small donation [[here](https://github.com/sponsors/reednel)] would be warmly appreciated

README 原文
https://github.com/astrogon/astrogon/blob/main/LICENSEhttps://github.com/astrogon/astrogon/blob/main/README.md

DeepSeek 根据仓库许可证和 README 整理 ·2026-10-02。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。

项目核对记录与介绍依据

模板资料

来源平台
GitHub
资料与维护参考分
资料较完整 · 85 / 100
技术栈
Astro
网站类型
启动器
这个分数如何计算

本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。

这个项目需要核对什么

记录的仓库更新时间
2025-08-15
截图检查日期
2026-10-02

已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。

目录记录的主要技术栈是 Astro。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。

查看具体选型方法 →

介绍的制作与核对状态

介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。

已完成服务器许可规则与 AI 来源核对;未经过人工编辑审核。

查看当时使用的来源资料

SHA-256: 7a855649dd43fc248167f80241d198bf8f3d3801394b464a95d873df0fdbf258

2026-10-02T16:00:00.520Z

来源文件 / 仓库

<div align="center">
  <img src="src/assets/astrogon-logo.svg" style="width:80%;" alt="Astrogon Logo" align="center" />
</div>

---

[![GitHub License](https://img.shields.io/github/license/astrogon/astrogon?color=red)](https://github.com/astrogon/astrogon/blob/main/LICENSE) [![Repo Size](https://img.shields.io/github/repo-size/astrogon/astrogon)](https://github.com/astrogon/astrogon) ![GitHub branch check runs](https://img.shields.io/github/check-runs/astrogon/astrogon/main) [![Website](https://img.shields.io/website?up_message=online&up_color=limegreen&down_message=offline&down_color=yellow&url=https%3A%2F%2Fastrogon.reednel.com%2F)](https://astrogon.reednel.com/)

Astrogon is a rapidly-customizable multipurpose website template built using Astro JS, Tailwind, and a sprinkle of React.

## Features

### Content Collections

- Blog
  - Implements **Categories** and **Tags**, for easy filtering and searching
- Documentation
  - **Multi-level** document structure
  - Toggleable **Doc Browser** sidebar
  - Toggleable **Table of Contents** sidebar
- Recipes
  - Demonstrates a highly **templated structure**
- Authors - A collection that can **link entries across collections** by the Author field
- Poetry - A trim interface for a lightweight collection, demonstrating pagination over the content pages
- Index Cards - A variation on the "Poetry" layout, where all content is kept in a single file, and displayed in a single page
- And more:
  - Homepage
  - About/Bio
  - Portfolio
  - Terms and Conditions
  - 404 page

#### Content Components & Features

- **Accordion**/collapsible section
- **Tabs** section
- **Code Block** with syntax highlighting
- **Quote Block**
- **Notice Blocks** - note, tip, info, & warning
- **Embedded YouTube Video**
- Integrated **LaTeX** support for inline and block mathematical expressions
- All the standard **MD/MDX** features, including footnotes, tables, and more

### Additional Features

- Comprehensive **Light Mode** and **Dark Mode** support, with automatic detection of system preference
- **Searchablility** over all content you choose to include
- **Adaptive Layout** for all screen sizes, from phone a to a desktop monitor
- **Tool Tips** that can be added seamlessly to any interactable element
- **Breadcrumbs** for rapid navigation
- Auto-populating **Related Content** section available for any content collection
- Auto-calculating **Reading Time** available for any content collection
- Togglable **Frosted Glass** effect on all components
- Easily customizable color scheme and typography
- Animated component **Transitions** for an elegant flourish
- **Pagination** for any content collection
- Component for **Social Media** sharing
- Built-in patterns for **Search Engine Optimization**

Every one of these features was designed with modularity and customizability in mind, for the smoothest development experience possible. For more details, see [docs/customization.md](docs/customization.md).

## Recommended Technologies

- [Git](https://git-scm.com)
- [Node Version Manager](https://github.com/nvm-sh/nvm)
- [Visual Studio Code](https://code.visualstudio.com/)

See [docs/tech-stack.md](docs/tech-stack.md) for more details.

## Development Instructions

1. Fork this repository to your own GitHub account, then clone it to your local machine
2. Use Node 22: `nvm install 22` or `nvm use 22`
3. From the project directory, install Node dependencies: `npm install`
4. From the project directory, build: `npm run dev`
   1. Alternately*: `npx astro build`, `npx wrangler dev`
5. See your changes live at `http://localhost:4321`

> *This is relevant if you intend to deploy your site to Cloudflare. Starting with Astro 5.8, Node 18 is unsupported, but the old Cloudflare Pages uses 18 by default. Wrangler appears to be necessary to use the new Cloudflare Workers. Read about Astro deployment [here](https://docs.astro.build/en/guides/deploy/cloudflare/#cloudflare-workers).

## License

Astrogon is licensed under the [MIT License](LICENSE).

## Acknowledgments

This template was originally inspired by the structures of [zeon-studio](https://github.com/zeon-studio)'s [astroplate](https://github.com/zeon-studio/astroplate), [jordienr](https://github.com/jordienr)'s [astro-design-system](https://github.com/jordienr/astro-design-system) and [TheOtterlord](https://github.com/TheOtterlord)'s [manual](https://github.com/TheOtterlord/manual).

## Sponsorship

[reednel](https://github.com/reednel) has dedicated hundreds of hours to building this template, and continues to maintain and improve on it. This software is fully Free and Open Source, but if you find value in it, a small donation [[here](https://github.com/sponsors/reednel)] would be warmly appreciated.
反馈内容错误

看看同类模板

对比同技术栈与用途的模板,找到更适合的视觉与内容结构。