Hexo 博客嵌入 pdf.js

效果见这篇文章

之前尝试过 hexo-pdf，最近发现 npm 提示依赖有冲突，找到这个仓库一看都九年没更新了，于是考虑直接用 pdf.js 实现 pdf 显示的功能。

首先来这里下载 pdf.js，解压后把里面的所有内容放到放到博客根目录的 source/js/pdfjs 里面。

在 _config.yml （注意不是主题的配置文件）里面添加这些东西（这里根据实际情况指定名称）^[1]：

pdfjs:
  enable: true
  src: /js/pdfjs/build/pdf.mjs
  workerSrc: /js/pdfjs/build/pdf.worker.mjs

在 skip_render 这一项里加上 js 目录：

skip_render: [js/**]

接下来可以通过这样的方式来使用 pdf.js：

<div class="pdf-container">
  <iframe src="/js/pdfjs/web/viewer.html?file=/assets/GAMES101.pdf" width="100%" height="600px"></iframe>
</div>

file 后面是文件的地址，比如说我在 source/assets 目录下有 GAMES101.pdf 这个文件，执行 hexo g 后会被复制到网站的根目录，所以这里用 /assets/GAMES101.pdf 来指定这个文件。

/js/pdfjs/web 下面有个似乎是用来测试的论文，想删也可以删了。

---

1. 如何在hexo博客中嵌入PDF ↩︎