pdfh5 pdf

踩坑1： 渲染失败

（1）在vue项目中，读取本地的pdf文件需要放到public下static文件夹中，不能放在别的地方；

（2）引用时，不能使用相对路径，因为使用public文件下面的资源，是不会被webpack处理的，它们会被直接复制到最终的打包目录下面，且必须使用绝对路径来引用这些文件。写法：“/static/pdf/show.pdf"，/即表示public文件夹(需略去public)；

文档：

https://www.npmjs.com/package/pdfh5

安装：

npm install pdfh5 --legacy-peer-deps
npm install --save canvas --legacy-peer-deps

<div id="app">
	<div id="demo"></div>
</div>
<script>

import Pdfh5 from 'pdfh5'
import 'pdfh5/css/pdfh5.css'
export default {
data() {
	return {
	pdfh5: null
	}
},
mounted() {
    this.pdfh5 = new Pdfh5('#demo', {
      pdfurl: '/static/1.pdf',
    });
  },
}
  </script>
  <style>
  #app {
	width: 100%;
	height: 100%;
	}
  </style>