使用宝塔从零部署Astro
- 1使用宝塔从零部署Astro本文
WordPress 的过于臃肿使站长不得不另选一个优质的博客框架，之前还折腾过一段时间的 Halo，但由于生态问题导致结果也是不尽人意 qaq
当我翻网上的博客站时发现了 Astro，那种丝滑的感觉所带给用户的舒畅感不亚于内急时找到了厕所。
经过 3days 的学习，也是上线了第一个版本。我想将过程分享出来帮助大家解决自己在使用 Astro 时所遇到的问题。
选择 Astro 的理由是?
Astro 静态博客和 WordPress 这类动态博客的本质区别，就是预制菜和现场炒菜区别。静态网站的访客来了直接看成品，速度飞快。WordPress这类动态博客呢，每次有人访问就现场从数据库拉数据、拼装页面。
说白了就是：快、便宜、不用操心服务器。动态博客需要服务器，一个月怎么也得几十块钱起步。相反，对于静态博客，GitHub Pages、Vercel、Cloudflare Pages全都免费托管，对于资金紧张的站长简直是天使来的。
静态博客和动态博客的性能差距呢?
根据不同条件下实际使用体验下来，Astro 真的令人眼前一亮。不仅首屏加载时间大幅下降，其整站体积也大幅缩小。
和其他框架相比?
直接上表格说话
| 框架 | 学习曲线 | 维护成本 |
|---|---|---|
| Astro | 低 | 低 |
| Next.js | 中 | 中 |
| Hexo | 低 | 低 |
| WordPress | 中 | 高 |
各个框架都有其所在的优势区，站长还是推荐根据自身需要来选择所需框架。
环境准备
安装 Node.js
推荐使用 Node.js v22.12.0 版本，根据官方文档，不支持奇数版本。
创建 Astro 项目
- 安装 Astro
Terminal window npm create astro@latestTerminal window pnpm create astro@latestTerminal window yarn create astro - 完成 Astro 安装向导
- 项目名称：自行填写
- 选择模板：选 Blog 模板（用方向键+回车）
- 安装依赖：选 Yes
- TypeScript配置：选 Strict 或 Strictest（相信我，类型检查能帮你省很多bug）
- 初始化Git仓库：选 Yes
为什么推荐Blog模板？因为它已经内置了文章列表、标签分类、RSS订阅的基础代码，比从空白模板开始省太多事了。我第一次用空白模板，光搞分页就折腾了两个小时。
- 启动你的 Astro 项目
Terminal window cd your-project-namenpm run dev打开浏览器访问这个
localhost:4321，你应该能看到一个已经搭好的博客框架了。npm run build可以打包你的项目。
主题选择
站长正在使用并且推荐大家使用 Firefly 主题。（无广，可以理会）
Firefly 是什么?
Firefly 是一款基于 Astro 框架和 Fuwari 模板开发的清新美观且现代化个人博客主题，专为技术爱好者和内容创作者设计。该主题融合了现代 Web 技术栈，提供了丰富的功能模块和高度可定制的界面，让您能够轻松打造出专业且美观的个人博客网站。
安装
- 下载 Firefly 主题
Terminal window git clone https://github.com/CuteLeaf/Firefly.gitcd Firefly - 安装依赖
Terminal window pnpm install - 启动开发服务器
Terminal window pnpm dev - 构建生产版本
Terminal window pnpm build
其余
推荐前往 Firefly 主题使用文档 查看更多关于 Firefly 主题的详细信息和使用指南。
考虑版本更新迭代以及实际需求，本站不过多赘述。
支持与分享
如果这篇文章对你有帮助，欢迎分享给更多人或打赏支持！