一个基于 Astro 构建的现代化博客主题,具有优雅的设计、丰富的功能和良好的用户体验。
- 现代化架构: 基于 Astro 5.x + TailwindCSS 4.x 构建
- 平滑页面过渡: 集成 Swup 实现流畅的页面切换动画
- 响应式设计: 完美适配桌面端和移动端
- 双主题支持: 支持亮色/暗色主题切换
- 博客功能: 支持 Markdown/MDX 文章、分类、标签、归档
- 评论系统: 集成 Waline 评论系统
- 全文搜索: 使用 Pagefind 实现静态搜索
- 音乐播放器: 集成 APlayer 音乐播放器
- 电子书阅读: 支持 EPUB 格式电子书在线阅读
- 文章点赞: 支持文章点赞功能
- 图片懒加载: 优化页面加载性能
- 代码高亮: 支持多种代码主题
Astro Theme Cactus in a light theme mode
Astro Theme Cactus in a dark theme mode
- Node.js: >= 18.0.0
- pnpm: 推荐使用 pnpm 作为包管理器
# 使用 pnpm 安装(推荐) pnpm install # 或使用 npm npm install
# 启动开发服务器 pnpm dev # GitHub Pages 开发模式 pnpm dev:github
# 构建生产版本 pnpm build # GitHub Pages 构建 pnpm build:github
pnpm preview
.
├── public/ # 静态资源目录
│ ├── assets/ # 静态资源(CSS、JS、图片、字体)
│ ├── avatar.svg # 头像
│ └── favicon.svg # 网站图标
├── script/ # 脚本工具
│ └── newpost.js # 新建文章脚本
├── src/ # 源代码目录
│ ├── api/ # API 接口
│ ├── components/ # 组件目录
│ │ ├── Archive/ # 归档组件
│ │ ├── ArticleCard/ # 文章卡片组件
│ │ ├── Comment/ # 评论组件
│ │ ├── Search/ # 搜索组件
│ │ └── ...
│ ├── content/ # 内容目录
│ │ ├── blog/ # 博客文章
│ │ └── ebook/ # 电子书
│ ├── data/ # 数据文件
│ ├── layouts/ # 布局组件
│ ├── pages/ # 页面路由
│ ├── plugins/ # 自定义插件
│ ├── scripts/ # 前端脚本
│ ├── styles/ # 全局样式
│ ├── config.ts # 网站配置
│ └── content.config.ts # 内容配置
├── astro.config.mjs # Astro 配置
├── package.json # 项目依赖
└── README.md # 项目说明
修改 src/config.ts 文件来自定义网站信息:
export default { Site: 'https://your-domain.com', Title: '你的博客标题', Subtitle: '博客副标题', Author: '作者名', Email: 'your@email.com', // ... 更多配置 }
使用脚本快速创建新文章:
pnpm newpost
项目集成了 Waline 评论系统。在使用前需要配置 LeanCloud:
- 注册 LeanCloud 账号并创建应用
- 在
src/config.ts中配置WALINE_SERVER_URL和WALINE_APP_KEY
| 页面 | 路径 | 说明 |
|---|---|---|
| 首页 | / |
博客文章列表 |
| 关于 | /about/ |
个人介绍 |
| 归档 | /archives/ |
文章归档 |
| 分类 | /categories/ |
文章分类 |
| 标签 | /tag/ |
文章标签 |
| 留言板 | /message/ |
留言功能 |
| 友链 | /friends/ |
友情链接 |
| 电子书 | /eBook/ |
EPUB 阅读器 |
| 地铁图 | /subway/ |
地铁线路图 |
# 部署到 GitHub Pages
pnpm deploy| 命令 | 说明 |
|---|---|
pnpm dev |
启动开发服务器 |
pnpm dev:github |
GitHub Pages 开发模式 |
pnpm build |
构建生产版本 |
pnpm build:github |
GitHub Pages 构建 |
pnpm preview |
预览构建结果 |
pnpm newpost |
创建新文章 |
pnpm offdev |
禁用开发工具栏 |
pnpm ondev |
启用开发工具栏 |
pnpm deploy |
部署到 GitHub Pages |
- 框架: Astro 5.x
- 样式: TailwindCSS 4.x
- 图标: SVG
- 评论: Waline
- 播放器: APlayer
- 图表: ECharts
- 电子书: EPUB.js
- 动画: Swup
- 代码高亮: Shiki
MIT License
欢迎提交 Issue 和 Pull Request!
如有问题或建议,欢迎通过以下方式联系:
- 邮箱: boycot2017@163.com
- GitHub: @boycot2015
⭐ 如果这个项目对你有帮助,请给个 Star!