Astro博客迁移记录
记录这个博客从 Hexo / Butterfly 迁移到 Astro 的过程,以及 AI 编程在主题修改中的帮助。
这是这个 Astro 博客的第一篇文章,用来记录站点从 Hexo 迁移到 Astro 后的初始搭建思路。
我最初使用的是 Hexo 框架,也很喜欢 Butterfly 主题带来的完整博客体验。后来把博客迁移到 Astro,一方面是因为 Astro 的静态输出、组件结构和内容集合更适合长期维护;另一方面,也是因为现在已经是 AI 时代,AI 对 Astro、TypeScript、CSS 和现代前端代码的理解更加顺手。有了 AI 编程之后,修改主题、重构布局、补齐交互细节都变得方便很多,不再需要长时间查文档和反复试错。
为什么选择 Astro
Astro 很适合内容型站点:页面默认输出静态 HTML,加载快,部署简单,也不会为了少量交互引入过重的前端运行时。对于个人博客来说,它既保留了 Markdown/MDX 写作体验,也方便后续逐步加入搜索、RSS、站点地图、代码高亮、文章目录、阅读模式和图片灯箱等功能。
更重要的是,Astro 的项目结构比较清晰。页面、组件、样式、文章内容都能拆开维护,AI 在分析这类代码时也更容易给出准确的修改建议。对于我这种喜欢折腾主题样式的人来说,这一点很有吸引力。
关于 Butterfly
如果你是刚入门博客的道友,我仍然很推荐先从 Hexo + Butterfly 开始。Butterfly 是一个非常成熟、完整、功能丰富的 Hexo 主题,Github 地址是:jerryc127/hexo-theme-butterfly。
对大多数个人博客来说,Butterfly 已经可以满足八九成的使用体验:文章页、分类、标签、归档、友链、深色模式、代码高亮、侧边栏、评论、统计、各种小组件和视觉效果都比较齐全。先用它搭起来,再慢慢理解博客系统的结构,会比一开始就自己写主题轻松很多。
迁移完成情况
这个 Astro 博客并不是对 Butterfly 的完整复刻,而是把我喜欢的 Butterfly 风格和使用习惯迁移到了 Astro 框架里。比如文章列表、文章页布局、目录、阅读模式、站点信息、友链、随机封面、代码块工具、明暗主题和一些细节交互,都已经在现在这个博客里逐步完成。
目前博客已经使用 Astro 框架构建完成,也可以正常生成静态文件并部署。不过它肯定还有不足的地方,比如细节样式、移动端体验、文章内容体系、性能优化和一些可能没有发现的小问题,都还需要继续完善。
后续完善
后续会继续维护这个博客,慢慢补齐文章内容,也会继续打磨主题细节。如果你在浏览过程中看到 bug、样式问题、链接错误,或者有什么建议,欢迎留言,或者发邮件与我联系。
感谢观看这篇废话文章。之后真正重要的内容,会慢慢写在这里。
版权声明
- 作者
- Dawn
- 许可
- 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来源 Dawn's Blog!