nuxt3项目使用pdfjs-dist预览pdf

news2024/10/6 6:46:15

使用的包的源代码是 pdfjs - npm

但是我们实际上项目中使用的是pdfjs打包后的dist文件,也就是pdfjs-dist - npm

所以我们需要使用这个命令

npm i pdfjs-dist

我们可以克隆pdfjs这个包来看源代码,里面有使用的例子,也可以根据源代码自己打包生成你想要的版本的pdfjs-dist,官方文档强调了对于新旧浏览器的区别,所以我们在使用dist包的时候也要注意浏览器的兼容

 你要是不嫌麻烦,可以使用源码打包自己的pdfjs-dist文件使用,但是一般我们不用这么干,npm上面有现成的

温馨提示,想学一门新的技术,好好看一下官方文档,比直接去网上搜怎么用块多了!认真点!

PDF.js

这个仓库是使用nuxt3 项目 实现的预览pdf,有需要的可以参考

https://gitee.com/yangjihong2113/pdfjs-nuxt3-demo

重点是新旧浏览器引入的包不同,低版本的浏览器需要使用legacy目录下的文件!

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/978462.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

18|乐观豁达:黄州重生的苏轼

好诗相伴,千金不换。你好,我是天博。 从这一讲开始,我们进入了这门课的最后一个主题:“见自己”。在这个主题里,我们会把重点放在“诗词给了我们什么”上,也就是怎样从诗词里汲取对我们有帮助的精神力量。…

中级深入--day19

鼠标动作链 有些时候,我们需要再页面上模拟一些鼠标操作,比如双击、右击、拖拽甚至按住不动等,我们可以通过导入 ActionChains 类来做到: 示例: #导入 ActionChains 类 from selenium.webdriver import ActionChains…

异步编程 - 01 漫谈异步编程发展史

文章目录 同步编程vs异步编程异步编程小故事单JVM异步地处理一些事情,而不需要知道异步任务的结果主线程等待异步任务的执行结果Future确实可以获取异步任务的执行结果,但是获取其结果还是会阻塞调用线程的,并没有实现完全异步化处理 --> …

LabVIEW应用开发——LabVIEW2019保姆级介绍、安装、第一个程序

一、前言 LabVIEW是一种程序开发环境,由美国国家仪器(NI)公司研制开发,类似于C和BASIC开发环境,但是LabVIEW与其他计算机语言的显著区别是:其他计算机语言都是采用基于文本的语言产生代码,而Lab…

JavaSE-日志

世上只有想不通的人,没有走不通的路。 文章目录 1. 日志概述2. Logback日志框架3. Logback快速入门4. Logback配置详解输出位置设置日志级别设置 1. 日志概述 通过日志可以查看程序运行的过程和详情。 输出语句的弊端: 信息只能展示在控制台。不能将其记…

java读取服务器数据包并下载至本地目录

jsch包如果没有的话,可评论联系我,我私发给你,或者通过https://mvnrepository.com/artifact/com.jcraft/jsch/0.1.55进行下载,添加至工程目录 package com.hbisdt.dqbasic.modular.util;import com.jcraft.jsch.*;import java.i…

OpenShift 4 - 利用 OpenShift 的 OAuth Proxy 实现应用身份认证

《OpenShift / RHEL / DevSecOps 汇总目录》 说明:本文已经在 OpenShift 4.13 的环境中验证 文章目录 部署测试应用只有认证用户才能访问只有有权的用户才能访问使用 ServiceAccount 访问参考 说明: 本文需要集群中除了管理员外还有一个一般用户。另外除…

Leetcode 1486.数组异或操作

给你两个整数,n 和 start 。 数组 nums 定义为:nums[i] start 2*i(下标从 0 开始)且 n nums.length 。 请返回 nums 中所有元素按位异或(XOR)后得到的结果。 示例 1: 输入:n 5, …

NPM 常用命令(四)

目录 1、npm diff 1.1 描述 1.2 过滤文件 1.3 配置 diff diff-name-only diff-unified diff-ignore-all-space diff-no-prefix diff-src-prefix diff-dst-prefix diff-text global tag workspace workspaces include-workspace-root 2、npm dist-tag 2.1 常…

79 # koa 相应结果设置

返回的类型可能是文件流,或者是对象的等方式,需要我们对 body 的类型进行判断在返回。 判断是否是 string 或者 buffer 、流、对象 if (typeof body "string" || Buffer.isBuffer(body)) {res.end(body); } else if (body instanceof Strea…

大模型参数高效微调技术原理综述(三)-P-Tuning、P-Tuning v2

随着,ChatGPT 迅速爆火,引发了大模型的时代变革。然而对于普通大众来说,进行大模型的预训练或者全量微调遥不可及。由此,催生了各种参数高效微调技术,让科研人员或者普通开发者有机会尝试微调大模型。 因此&#xff0c…

面试题速记:JavaScript有哪些数据类型,它们的区别是?

JavaScript有哪些数据类型,它们的区别? JavaScript共有八种数据类型,分别是 Undefined、Null、Boolean、Number、String、Object、Symbol、BigInt。 其中 Symbol 和 BigInt 是ES6 中新增的数据类型: ●Symbol 代表创建后独一无二…

vue3 element - plus 安装使用教程

下边是安装教程 element - plus 是针对 vue3 开发 一个 Vue 3 UI 框架 | Element Plus (element-plus.org)https://element-plus.org/zh-CN/ 安装 element - plus ui 库 # 选择一个你喜欢的包管理器# NPM $ npm install element-plus --save# Yarn $ yarn add elemen…

python 学习笔记(4)—— webdriver 自动化操作浏览器(基础操作)

安装 web driver: 使用 driver 前,需要下载与浏览器版本相对应的 driver。如要在 Chrome 浏览器上操作,就要下载Chrome Driver。 几个常用浏览器的参考和下载地址: Edge Driver:https://developer.microsoft.com/en…

C++内存区堆和栈

在C中,内存分成5个区,堆、栈、自由存储区、全局/静态存储区和常量存储区。 栈,就是那些由编译器在需要的时候分配,在不需要的时候自动清除的变量的存储区。里面的变量通常是局部变量、函数参数等。 堆,就是那些…

《Linux从练气到飞升》No.21 Linux简单实现一个shell

🕺作者: 主页 我的专栏C语言从0到1探秘C数据结构从0到1探秘Linux菜鸟刷题集 😘欢迎关注:👍点赞🙌收藏✍️留言 🏇码字不易,你的👍点赞🙌收藏❤️关注对我真的…

​​​​​​​光伏智慧设施休息区

随着人们环保意识的日益增强,光伏智慧景观渐渐出现在大众的视野,成为低碳城镇建设的新景观、新亮点。打造光伏智慧设施休息区,既能满足游客休息纳凉,还能设置手机相机等充电区域。此设备组还可提供夜间照明灯、音乐广播、多媒体广…

flask中的操作数据库的插件Flask-SQLAlchemy

1、ORM 框架 Web 开发中,一个重要的组成部分便是数据库了。Web 程序中最常用的莫过于关系型数据库了,也称 SQL 数据库。另外,文档数据库(如 mongodb)、键值对数据库(如 redis)近几年也逐渐在 w…

普通平衡树 Splay

Splay 简介 Splay(伸展树),又叫做分裂树,是一种自调整形式的二叉查找树,满足二叉查找树的性质:一个节点左子树的所有节点的权值,均小于这个节点的权值。且其右子树所有节点的权值,均…

IEC 62368-1:2023(第4版)《音频视频、信息和通信设备 第1部分安全要求》标准发布,IEC 62368-1第四版标准更新与变化

2023年05月26日,IEC 62368-1:2023 《音频视频、信息和通信设备 第1部分安全要求》第4版标准正式发布,2023年08月18日,IECEE又发布了TRF模板,为新版标准的实施和应用做好了准备. 下载地址 : https://download.csdn.net…