Astro博客

astro-theme-aonote — Astro 博客模板

作者 runsli

面向 Astro 的静态博客主题,提供 GFM、MathML 公式、Shiki 代码块、归档、标签与 RSS/Atom 订阅。

看看你的网站会是什么样

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

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

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

全部页面与视图 3

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

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

值得关注的模板亮点

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

01

支持 GFM:表格、任务列表、脚注、定义列表与提示块

02

数学公式以 MathML 输出(temml),不依赖 KaTeX 运行时 CSS

03

Shiki 代码高亮,支持标题、行高亮与 diff 等元数据

04

内置归档、标签、RSS 与 Atom 订阅以及 sitemap

05

提供明暗主题与 zh-CN / en 界面文案

06

部署在仓库子路径时链接按子路径处理

模板详细介绍

astro-theme-aonote 是一个用于 Astro 的静态博客主题,仓库以 MIT 许可发布,演示站点部署在 Vercel。主题围绕 Markdown 写作组织内容:文章放在 src/content/posts/,关于页放在 src/content/pages/about.md,站点标题、baseUrl、语言与版权在 src/site.config.ts 中配置。

渲染方面,主题支持 GFM 的表格、任务列表、脚注、定义列表与提示块;数学公式以 MathML 输出(使用 temml),不依赖 KaTeX 运行时 CSS;代码块由 Shiki 高亮,并支持标题、行高亮与 diff 等元数据。站点层面提供归档、标签、RSS 与 Atom 订阅以及 sitemap,界面包含明暗主题和 zh-CN / en 两套文案,部署在仓库子路径时链接会按子路径处理。

使用限制方面,主题要求 Node ≥ 22.12.0(Astro 6),推荐 Node 22 LTS;构建命令为 npm run build,输出目录为 dist,仓库附带 vercel.json(含 CSP 头),Netlify 需使用相同的构建命令与发布目录。演示图片、字体、图标等第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断;域名、托管等外部服务可能另外收费。

Astro博客

适合你的项目吗?

适用场景

  • 用 Markdown 撰写并发布个人技术博客
  • 需要展示数学公式与代码高亮的文章站点
  • 希望提供归档、标签与 RSS/Atom 订阅的静态博客
  • 部署在 Vercel 或 Netlify 上的静态站点

适合人群

  • 使用 Astro 搭建静态博客的开发者
  • 需要 GFM、MathML 与 Shiki 代码块的内容站点
  • 偏好明暗主题与中英文界面文案的用户
  • 接受 Node ≥ 22.12.0 并按文档配置 site.config.ts 的使用者

上手与定制指南

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

  1. 1

    通过 npm create astro@latest my-blog -- --template runsli/astro-theme-aonote 使用模板,或克隆仓库后执行 npm install 与 npm run dev。

  2. 2

    在 src/site.config.ts 中设置标题、baseUrl、语言与版权;文章放入 src/content/posts/,关于页为 src/content/pages/about.md。

  3. 3

    需要 Node ≥ 22.12.0(Astro 6),推荐 Node 22 LTS。

  4. 4

    构建命令为 npm run build,输出目录为 dist;部署后需将 baseUrl 改为生产 URL。

  5. 5

    仓库附带 vercel.json(含 CSP 头);Netlify 使用相同构建命令与发布目录。

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

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

使用时需要遵守

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

额外费用与待核对事项

  • 使用该主题需 Node.js 版本不低于 22.12.0(因依赖 Astro 6),推荐使用 Node 22 LTS;低于此版本无法运行。
  • 部署依赖 Vercel 或 Netlify 等第三方托管服务,这些外部服务可能产生费用或需要注册账号。
  • 部署后必须手动将 src/site.config.ts 中的 baseUrl 改为生产环境 URL,否则站点链接可能不正确。
  • 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
  • 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
查看原文依据

Permission is hereby granted, free of charge

许可证原文

**Node:** ≥ 22.12.0 (Astro 6). Node 22 LTS is recommended.

README 原文

Import the repo on [Vercel](https://vercel.com/new) or [Netlify](https://app.netlify.com/start)

README 原文

After deploy, set `baseUrl` in `src/site.config.ts` to your production URL.

README 原文
https://github.com/runsli/astro-theme-aonote/blob/main/LICENSEhttps://github.com/runsli/astro-theme-aonote/blob/main/README.md

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

项目核对记录与介绍依据

模板资料

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

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

这个项目需要核对什么

记录的仓库更新时间
2026-07-06
截图检查日期
2026-10-02

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

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

查看具体选型方法 →

介绍的制作与核对状态

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

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

查看当时使用的来源资料

SHA-256: 32c64b3481d45c5c69be5310af0700886de0f612d62c550e819b8fd49ce48c54

2026-10-02T16:48:04.064Z

来源文件 / 仓库
# astro-theme-aonote

English | [中文](README.zh-CN.md)

[![Live Demo](https://img.shields.io/badge/demo-live-0ea5e9)](https://astro-theme-aonote.vercel.app)
[![Astro](https://img.shields.io/badge/Astro-6-BC52EE?logo=astro&logoColor=white)](https://astro.build)

**Static blog theme for [Astro](https://astro.build) 6** — GFM, MathML math, Shiki code blocks, archive, tags, and RSS/Atom.

| | |
| --- | --- |
| **Live demo** | https://astro-theme-aonote.vercel.app |
| **Upstream** | https://github.com/runsli/Aonote |

## Screenshots

| Homepage — recent posts, tag cloud, dark/light | Post page — TOC, MathML, syntax-highlighted code |
| --- | --- |
| ![Homepage showing post list, tags, and theme toggle](docs/screenshots/home.png) | ![Post with table of contents sidebar, math equations, and code blocks](docs/screenshots/post.png) |

## Features

- GFM: tables, task lists, footnotes, definition lists, admonitions
- Math as **MathML** (temml), no KaTeX runtime CSS
- Shiki code blocks with Aonote-style metadata (title, line highlight, diff)
- Archive, tags, RSS + Atom, sitemap
- Light / dark theme, zh-CN / en UI strings
- Subpath-aware links when deployed under a repo path

## Quick start

### Use as Astro template (recommended)

```bash
npm create astro@latest my-blog -- --template runsli/astro-theme-aonote
cd my-blog
npm install
npm run dev
```

### Clone this repo

```bash
git clone https://github.com/runsli/astro-theme-aonote.git
cd astro-theme-aonote
npm install
npm run dev
```

Open http://localhost:4321 and edit:

1. `src/site.config.ts` — title, `baseUrl`, language, copyright
2. `src/content/posts/` — your Markdown posts
3. `src/content/pages/about.md` — about page

**Node:** ≥ 22.12.0 (Astro 6). Node 22 LTS is recommended.

## Deploy

[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Frunsli%2Fastro-theme-aonote)

1. Import the repo on [Vercel](https://vercel.com/new) or [Netlify](https://app.netlify.com/start) (or use the button above).
2. **Build:** `npm run build` · **Output:** `dist` (framework preset: Astro).
3. After deploy, set `baseUrl` in `src/site.config.ts` to your production URL.

`vercel.json` is included (CSP headers). For Netlify: same build command and publish directory.

To fork via GitHub: enable **Template repository** under repo Settings, then **Use this template** or `npm create astro@latest -- --template runsli/astro-theme-aonote`.

## Customize

| What | Where |
| --- | --- |
| Site title, URL, locale | `src/site.config.ts` |
| UI strings | `src/i18n.ts` |
| Global layout / nav | `src/layouts/BaseLayout.astro` |
| Theme CSS | `src/styles/aonote.css` |
| Markdown pipeline | `src/integrations/aonote-markdown.ts` |
| Feed limits | `src/utils/feed.ts` |
| `robots.txt` / sitemap URL | `src/pages/robots.txt.ts` (uses `site.config.ts`) |

## Project layout

```text
src/
├── site.config.ts
├── content/
│   ├── posts/          # Blog articles
│   └── pages/          # about, 404
├── layouts/
├── components/
├── pages/              # Routes
├── integrations/       # Markdown / Shiki
└── styles/aonote.css
```

## Scripts

| Command | Action |
| --- | --- |
| `npm run dev` | Dev server |
| `npm run build` | Production build → `dist/` |
| `npm run preview` | Preview build |
| `npm run check` | `astro check` |

## Contributing

See [CONTRIBUTING.md](CONTRIBUTING.md).

## License

MIT — see [LICENSE](LICENSE). Original Aonote design and styles © [runsli](https://github.com/runsli).
反馈内容错误

看看同类模板

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