pdf.js如何修改库文件引用路径替代现有window挂载写法

你原来使用的window['pdfjs-dist/build/pdf']是umd格式的pdf.js包引入后，挂载在window对象上的默认命名空间，要修改引用路径可以按你的项目场景选择对应方案：

• 纯HTML无构建场景
  直接修改页面中引入pdf.js的script标签的src属性为你需要的相对/绝对路径即可，示例如下：

  <!-- 将src替换为你的自定义路径，比如本地存放的/static/lib/pdf.min.js -->
  <script src="/your/custom/path/pdf.min.js"></script>
  <script>
  // 配置对应worker文件路径，和pdf.js同目录下的pdf.worker.min.js
  pdfjsLib.GlobalWorkerOptions.workerSrc = '/your/custom/path/pdf.worker.min.js';
  
  var url = 'something/helloworld.pdf';
  // 直接使用全局暴露的pdfjsLib变量，不需要再从window上按路径字符串取
  var loadingTask = pdfjsLib.getDocument(url);
  loadingTask.promise.then(function(pdf) {
    console.log('PDF loaded');
    // 后续业务逻辑
  });
  </script>
  

• 有webpack/vite等构建工具的项目场景
  可以直接通过import语法引入自定义路径下的pdf.js包，示例如下：

  // 替换为你存放pdf.js的相对/绝对路径
  import * as pdfjsLib from './public/lib/pdfjs/build/pdf';
  // 配置对应worker路径
  pdfjsLib.GlobalWorkerOptions.workerSrc = './public/lib/pdfjs/build/pdf.worker.js';
  
  var url = 'something/helloworld.pdf';
  var loadingTask = pdfjsLib.getDocument(url);
  loadingTask.promise.then(function(pdf) {
    console.log('PDF loaded');
  });
  

如果你是通过npm安装的pdfjs-dist包，不需要修改原有业务代码的情况下也可以调整打包工具的路径别名配置，把pdfjs-dist/build/pdf指向你自定义的文件路径即可，原来的window['pdfjs-dist/build/pdf']写法不需要改动也能生效。

内容的提问来源于stack exchange，提问作者Joao