Vue项目使用jsPDF报错ReferenceError: jsPDF is not defined如何解决

1. 你使用的2.x版本jsPDF的UMD构建包不会直接在全局挂载jsPDF变量，而是将所有导出内容挂载到window.jspdf命名空间下，构造函数需要从该命名空间下获取。
2. 你的Vue入口脚本设置了type="module"，ES模块内部的顶层作用域独立于全局window作用域，即使全局有挂载变量也无法直接访问，必须显式从window对象读取。

方案1：保留现有CDN引入方式 #

直接修改组件内调用逻辑，显式从全局命名空间获取构造函数即可：

exportSimple: function() {
    const { jsPDF } = window.jspdf
    const doc = new jsPDF()
    // 剩余原有导出逻辑保持不变
}

你之前的测试方法也同步修改即可正常运行：

let jsPrint = () => {
  const { jsPDF } = window.jspdf
  const doc = new jsPDF()
}

方案2：npm安装引入（更符合Vue项目开发规范） #

如果之前npm安装后使用报错是引入方式错误，按以下步骤调整：

1. 执行安装命令：npm install jspdf@2.4.0
2. 在需要使用的Vue组件顶部引入构造函数：

import { jsPDF } from 'jspdf'

export default {
  // 其他组件配置
  methods: {
    exportSimple() {
      const doc = new jsPDF()
      // 剩余原有导出逻辑保持不变
    }
  }
}

修改完成后重新启动项目即可解决未定义报错。

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