思源 3.0.4 导出 PDF/ 图片 与主题不一致

本贴最后更新于 277 天前,其中的信息可能已经斗转星移

现象

在 Linux 下,思源 3.0.4,使用集市上的「知乎」主题,对于有代码块的文档,导出的 PDF 出现空白首页和末页滚动条,导出的图片三个按钮效果变成了一个。具体情况如下:

屏幕效果:

截图 20240320100242.png

导出的 PDF 效果(注意代码块的语言显示位置不正常,页面下面出现了滚动条):
截图 20240320095650.png

导出图片前的预览效果:

截图 20240320095601.png

导出图片的实际效果(注意三个按钮变成了一个):

截图 20240320095625.png

诊断

我对这个问题进行了测试,发现如果导出为「思源 HTML」,再通过 Edge 浏览器打印到 PDF,效果正常。以前版本的思源也没有问题(抱歉记不住版本号了)。怀疑是思源在导出 PDF 和图片的时候,加入了额外的 CSS 控制,这些控制导致了预览效果和实际效果不一致。这种不一致导致主题不可用,给主题作者带来很大影响(试来试去,只有默认主题才能正常,但主题作者完全不知道做错了什么)。是否可以有一个指导文档,让主题来确保输出 PDF 和图片的效果和显示效果一致?或者在思源中进行修复,确保不改动主题 CSS 指定的显示效果?

附件

测试文档:Python 编程课作业.sy.zip

输出的 PDF:Python 编程课作业.zip

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    23013 引用 • 92566 回帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • 导出图片无黄绿灯应该是受到 html2canvas 这个库的制约,需要看一下是否能解决这样 css 的问题

    导出 PDF 我这里是没有滚动条的,语言高度不一致需要用 css 设置一下即可。

  • 其他回帖
  • programfan

    谢谢 D 大回复。

    这个问题看起来是主题的问题,但实际上来源于思源底层在转换 PDF 和图片的时候,加入的额外的 CSS 或额外的设置和主题有冲突。这个额外设置不知道在哪,主题想修但不知道如何修。有没有方法拿到输出 PDF 的中间产物?

    我问这个问题是因为我自己维护了一套自用的主题,里面用到了知乎主题的代码块 CSS,出现同样的问题,搞了几天也没搞明白原因是什么。现在想要修复这个问题,所以采用了知乎主题来复现。

    我觉得这个不全是主题的问题的理由是:直接导出为「思源 HTML」,再通过 Edge 浏览器输出为 PDF,结果就非常正常。这说明主题自己的 CSS 在浏览器中是正常的,思源输出的 PDF 不正常一定是变化了一点什么。现在就是想搞懂这个变化是啥,我就能把自己主题里面的问题修复,顺便可以给知乎主题提一个 PR。

  • programfan

    语言高度倒是在导出的 HTML 里面也能复现,就是把 CSS 标题栏的宽度算成 0.001 了,不知道为什么。

  • 88250

    这个估计得给主题仓库提 issue,谢谢。

  • 查看全部回帖