绝妙的Typst博客框架

背景故事

其实在很早之前我就用上了Typst来处理日常的排版任务,其相对于LaTeX带来了很多便利1
1
好处是快,以及写错了能正确的报错,复杂的逻辑在Typst要阳间不少。 代价是完全没有PostScript支持了,只能回到PDF来处理图像,不过支持PDF我就很感恩了——因为很早之前Typst甚至只支持svg的矢量图。
,尤其是在日常文档编排期间,Typst提供了绝妙的编程手段实现大量编排自动化产生的图像和从原始数据生成表格,以便阅读。 成了Typst的熟练工之后,我就进入了拿着锤子,看什么都是钉子的状态,只要不涉及协作和投稿的排版需求,我都会用Typst而不是LaTeX。

在 Typst 支持 HTML 导出之后,我就在琢磨博客的生成系统有没有可能从 Markdown 切换为 Typst。 但是受限于时间限制——毕业前后各种原因忙得团团转,于是一直没能实施。直到最近发现了一个各方面都满足我喜好的 Typst 博客框架: Tufted-Blog-Template。于是干脆一不做二不休,直接把博客系统从 Hexo 换成了这么个方案。

解决的痛点

这个框架设计有个最大的好处是编译过程就是直接把所有Typst文件编译成路径对应的HTML文件,所需的工具链非常简单,不像 Hexo 那样需要 Node.js 及其引入的海量依赖包2
2
我不是说Node.js不好,而是使用过程中遇到报错经常让人无法下手+想要修改依赖包的行为很麻烦。
。并且清晰的结构很适合让AI上手实现我想要的功能。

迁移过程

迁移本身其实很简单,用 pandoc 逐个把 Hexo 的 Markdown 文件转换为 Typst 文件,然后让AI相应的补充Typst文件中需要的元数据和样式定义。不过日常的bug体质的我,迅速就发现了一些微妙的bug。

  1. quote-block 等环境的数学公式排版字体莫名的大,并且宽度受限3
  2. 移动端的目录页面被奇怪的压缩了4
  3. 在表格、block、list等环境用 #footnote 生成的旁注对齐错误 5
    5

    Yousa-Mirage/Tufted-Blog-Template:44

    这一条比较复杂,很大程度上包括两个更改:

    1. 修改 CSS 规则保证在各种环境下 footnote 的位置不会错的太离谱(之前在table中调用 footnote 结果是旁注被塞到了表格里面)
    2. 用一个 JS 脚本在页面加载时把所有的 footnote 元素移动横向位置正确对齐(纵向位置不变)
不过这些bug都不是问题——在开放人工智能研究中心 ™︎ 对话用生成式预训练转换器五点六太阳版6
6
OpenAI ChatGPT 5.6-Sol
的帮助下——它们很容易就得到了解决。

此外,在本项目源代码中,我还实现了一些纯粹因为个人喜好而进行的更改,这包括

这些都没准备提交为PR,因为改动规模太大了,不过要是大伙感兴趣可以去我的仓库拣选。

最后

迁移友链的时候发现很多链接其实都死掉了…那我算是矮子里面拔高个,只是有那么一段时间没有更新罢了。