jsPDF未定义答案

【问题标题】：jsPDF is not definedjsPDF未定义
【发布时间】：2021-12-17 18:38:33
【问题描述】：

我正在尝试将 jsPDF 与 Vue 一起使用，但我得到了 ReferenceError: jsPDF is not defined。见 sn-p ：

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

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.4.0/jspdf.umd.min.js"></script>
  <button onclick="jsPrint()">
    print
  </button>

脚本链接在head标签中：

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?= $site->title() ?> - <?= $page->title() ?></title>
    <link rel="stylesheet" href="<?= url('assets') ?>/css/style.css">

    <!--========== JSPDF ==========-->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.4.0/jspdf.umd.min.js"></script>
    
    <!--========== VUE ==========-->
    <!-- development version, includes helpful console warnings -->
    <script src="<?= url('assets') ?>/js/libs/vue.js"></script>
    <script src="<?= url('assets') ?>/js/app.js" type="module" defer></script>
</head>

然后在一个组件中，我有一个应该在点击按钮时触发的方法：

exportSimple: function() {
            const doc = new jsPDF()
            // const target = document.querySelector('#dialog-export-content')
            // doc.html(target, {
            //     callback: function(doc) {
            //         doc.save()
            //     },
            //     x: 10,
            //     y: 10
            // })
            
        }

但是我抛出了一个错误。

我尝试了其他方法来链接库：本地、npm、其他来源，如jspdf.es.min.js。没有任何效果。

有什么想法吗？

【问题讨论】：

标签： vue.js jspdf referenceerror

【解决方案1】：

使用 CDN，jsPDF 对象可作为 jspdf 的属性使用，可在全球范围内使用：

const { jsPDF } = jspdf
let print = () => {
  const doc = new jsPDF()
}

【讨论】：