这篇具有很好参考价值的文章主要介绍了Vue-pdf踩坑记录。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。
最近在公司的一个项目中，需要在线预览PDF文件。基于vue-admin-electron的模板中开发。开发机系统为Windows，使用的框架为electron-vue。
坑1：在通过vue-router路由到含有vue-pdf组件的页面时报：“syntaxError: Unexpected token <” 错误。
解决方法：将vue-pdf添加到webpack配置文件的白名单中。
我是electron，所以在.electron-vue文件夹中的webpack.renderer.config.js文件将vue-pdf添加到whiteList中，如图所示：文章来源：https://www.toymoban.com/news/detail-512396.html
文章来源地址https://www.toymoban.com/news/detail-512396.html
到了这里，关于Vue-pdf踩坑记录的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处： 如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！
场景：前端需要根据后端返回的线上pdf的地址，实现pdf的预览功能。 情况一：后端返回的pdf地址，粘贴到浏览器的url框中，是可以在浏览器中直接进行预览的。 方法（1）可以直接使用window.open（\\\'获取到的pdf地址\\\'）重新打开一个浏览器页签，通过浏览器页签直接实现预览功
vue2中预览pdf的方法有pdf.js和vue-pdf等。下面进行简单对比使用方法的介绍。 使用iframe预览pdf 如果后端返回的不是url，那么需要使用 responseType = \\\'blob\\\' 来读取后端传来的内容。 扩展： 同样是使用iframe进行预览，如果有 其他格式 如word/xls/ppt/txt的文件需要预览，可以使用微软解
目录 一、安装npm 依赖 二、引入组件 1、html中使用组件 单页 多页 2、数据处理 单页 多页 三、项目使用--代码部分 四、报错解决 前言 使用vue-pdf组件实现文件预览功能 并在文件上增加操作按钮 vue3不支持vue-pdf，vue3项目用pdfjs-dist 1、在根目录下输入一下命令 2、修改
原理就是给显示pdf 的容器增加一层水印遮罩层 下载： 通过url获取pdf文件的arrarybuffer文件流 将arraybuffer数据转成pdf文档 添加水印字体（内置/自定义） 为每页pdf添加文字水印 保存pdf文件的unit64Arrary文件流 预览： 创建canvas容器（用于显示水印文字） 创建水印canvas 将水印canv
使用命令npm run serve时vue项目报错： Module not found: Error: Can\\\'t resolve \\\'vue-pdf\\\' in \\\'xxx\\\' 解决方案： 运行命令 ： 即可解决。 再次顺利执行npm run serve
根据公司的实际项目需求，要求实现对pdf和ofd文件的预览，并且需要限制用户是否可以下载、打印、另存pdf、ofd文件，如果该用户可以打印、下载需要控制每个用户的下载次数以及可打印的次数。正常的预览pdf很简单，直接调用浏览器的预览就可以而且功能也比较全，但是一
项目开发使用vue-pdf,单页情况预览正常，多页vue-pdf预览异常，第一次预览时，会先弹出异常模态窗口，关闭模态窗口，pdf又是正常显示，报错信息及异常截图如下： 异常截图，点击右上角关闭X，pdf是正常预览，再次打开后也能正常预览，仅第一次打开预览有异常。 1.vue-pdf预
![Vue中 引入使用 patch-package 为依赖打补丁 （以修改 vue-pdf 打包后 [hash].worker.js 路径问题为例）](https://imgs.yssmx.com/Uploads/2024/02/684775-1.png)
1. patch-package 简介 patch-package npm地址 patch-package github文档 如果不需要在生产中运行 npm (如：正在制作 web 前端，则可使用 --save dev） 1.2 使用方法 制作修补程序 首先更改 node_modules 文件夹中特定包的文件，然后运行 或使用 npx （npm 5.2） package-name 与所更改的程序包的名称相匹配
安装Jq npm install jquery --save vue列表跳转到详情页，再返回列表的时候不刷新页面并且保持原位置不变； 解决：使用keepAlive 在需要被缓存的页面的路由中添加：keepAlive: true, 记录位置 在app.vue中： 然后，就可以啦，问题就解决了（返回列表页不会触发created） vue退出登录后,如何
目录 下载gs920w64.exe 安装 配置相关信息 验证是否安装配置成功 合并多个pdf文件 https://github.com/ArtifexSoftware/ghostpdl-downloads/releases/tag/gs920 正常安装，记住自己的安装目录： 安装完后，然后进入自己的安装目录gsgs9.20，复制bin的目录位置 打开环境变量，系统变量
