如何从 WordPress 逃离到 Astro
0 想法与选型
由于我苦 WordPress 久矣,因此迁移博客系统是一个隔两天就会被放到脑子里过一遍的想法。
但是你真要说苦什么,其实用起来也挺正常的。无非是攻击面大一点,技术栈陈旧一点,服务器资源消耗大一点什么的,都是一些不痛不痒的事情。
但是人总是要折腾一下自己的,既然要换,就得先选型。
其实我是很倾向于动态博客的,毕竟写个博客非要个 Git 环境什么的有点不爽。但是大部分动态博客框架和 WordPress 大同小异,要么做得不够好,要么做得不够全。
那就考虑静态博客了。Hexo 也不是没有用过,但是感觉上一方面也有历史包袱,另一方面之前用下来也确实不好用。剩下的框架基本上也是一个德性。
Astro 其实和上面这些也差不多,当然有更多好用的语法糖和更自然的定义形式,毕竟不是为博客特化的,这会带来额外的灵活性。但是真正引起我注意的是,有人给 Astro 做了 Typst 支持,这个之前没有想过,但是一想就很诱人。Latex 的数学语法在大多数情况还是不如 Typst,而且完整的 Typst 支持意味着比 MathJax / Katex 多了很多灵活度,比如说 Typst 模版可以广泛运用到每一个文件中。
理想是美好的,那么现实呢?
1 Typst 与 HTML
Typst 的 html export 其实依旧在绝赞实验性支持中。其中一个很悲伤的故事是,数学公式的 html export 还在路上。
因此你直接使用astro-typst并不会带来预想的效果,要么结果全文作为 svg 导出,要么丢失数学公式 – 两者都不是太能接受。
自然的想法是让比较复杂的部分以 SVG 格式嵌入在 HTML 产物中,通过 #show math.equation: html.frame 可以做到这一点。
问题到这,当然没有解决。笔者在第一次尝试迁移的时候是去年 10 月,这个时候 astro-typst 会默认使用 typst.ts 的 hast 模式。所谓 hast,就是 html ast,这个方式下,svg 会以 base64 encode 的形式传输到 html 产物中。理论上这不会有问题,但是你会发现实际的产物中,数学公式被截断了。
这是因为生成出来的数学公式 svg 的高度是不正确的,但是被内嵌到 img src 后也不太好让它 overflow,对此我当时的解决方法是魔改 astro-typst 让它不要走 hast 传输,然后这两天一看 astro-typst 更新了这个选项。
到此,我们已经有良好的 Typst 支持了。
2 迁移
2.1 文章
首先是怎么转成 Markup 语言所写的文件。转成 Typst 想起来就头疼,但是转成 MarkDown 可就有太多前人工作了。我选择了 https://github.com/lonekorean/wordpress-export-to-MarkDown 来将 WordPress 的 backup 转成 MarkDown 文件。
这个脚本并不能很好地将媒体库的内容拖下来。先前的多次迁移也使得我的媒体库已经千疮百孔了。但是它导出的内容可以选择不迁移保留 https 链接,我决定战术性偷懒,直接将 wp-content 目录映射到先前的位置。这样就不用管媒体库导出的问题了。
2.2 评论
博客这么多年累计下来也有不少评论了,如果说全丢了未免可惜。给静态博客选择评论系统也是老生常谈的话题。Disqus 一年不如一年,Gitalk 我个人则不太喜欢,这意味着在博客的活动会直接反应在 Github 上,如果 ref 了某个 GitHub issue 之类的,还会在对应的地方显示被 ref,副作用太大了。
那其实剩下的选项还是自己搭一个出来,一套比下来还在活跃开发的其实就是Waline了。
不得不吐槽的是,Waline 的初始化竟然要手动导入文件,这个年代怎么还有这么古朴的玩法。
那么如何迁移呢,Waline 并不支持直接从 WordPress 导入评论,但是他的备份格式其实挺简单的。把先前 MariaDB 里的 wp_comments 导出成 JSON 文件,然后写个脚本魔改一下就可以导入了。
然后导入后就会发现评论时间显示的是导入时间,这是 insertat 一列会在插入时自动更新导致的。我也没试图从源码上解决,直接在数据库里令 insertat 等于 updateat 了。
一个很有意思的事情是, Waline 基于 path 决定页面,而且会觉得 /a 和 /a/ 是两个页面。这在 Caddy 下不是什么事情,会自己重定向到后者,但是在本地测试的时候会略显微妙。
2.3 链接迁移
由于早年 SEO 相关问题(谣传),当时选择了伪静态的作为博客的持久 URL。这一方面在 Astro 下不太好搞,另一方面看起来也略显别扭。
迁移 URL 则会带来很多问题,一个是老链接需要维护重定向,另一个是评论链接需要修改。
但是这两个都不是大事情,在上文工具导出 WordPress 文章的时候可以选择顺带导出一下 Post ID,剩下就是 shell 脚本练习题了。
值得一提的是重定向一开始还在想怎么办,最后直接在 Caddy 的配置文件里丢了一百行 redir,最后还是 Caddy 扛下了所有。
3 总结
剩下的工作主要是 SEO 和 CDN 的配置。这两个都没有特别多好说的,SEO 本质是乱糊,CDN 的话 Astro 有非常好的支持。
作为测试,我将自己用 Typst 写的课程报告捡了一部分发了出来,可以看编译原理课程设计报告查看效果。
实践上看由于基本上避免了客户端 JavaScript 的加载,现在的加载速度非常不错。
目前被我咕掉的有,暗色模式,友链和 TOC。目测困难是比较有限的,搞好了应该会有下一篇的,吧?