无法离线使用下载的库(pdfmake)

问题描述 投票:0回答:1

我正在尝试在离线网页中使用 pdfmake JS 库。 我从https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.66/pdfmake.min.js下载了CDN文件并将其离线保存在..app/js/pdfmake.js

我使用 require 加载了库:

require([
   'js/pdfmake.js',
...])

我使用下面的示例测试该库:

var buttonTS = document.getElementById("buttonTS")
butonTS.addEventListener("click", function(){
            
  var docDefinition = {
    content: [
            'First paragraph',
            'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines'
        ]
    };

    var now = new Date();

    var pdf = pdfmake.createPdf(docDefinition);
    pdf.write('pdfs/basics.pdf').then(() => {
        console.log(new Date() - now);
    }, err => {
        console.error(err);
    });
}

但是库没有加载,并抛出错误:

Uncaught ReferenceError: pdfmake is not defined

这很奇怪,因为我有其他库(SweetAlert),它们可以正常工作。

感谢您的帮助!

javascript offline pdfmake
1个回答
0
投票

这是一个您可以检查的工作示例

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>

</body>
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/pdfmake.min.js"
  integrity="sha512-a9NgEEK7tsCvABL7KqtUTQjl69z7091EVPpw5KxPlZ93T141ffe1woLtbXTX+r2/8TtTvRX/v4zTL2UlMUPgwg=="
  crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/vfs_fonts.min.js"
  integrity="sha512-P0bOMePRS378NwmPDVPU455C/TuxDS+8QwJozdc7PGgN8kLqR4ems0U/3DeJkmiE31749vYWHvBOtR+37qDCZQ=="
  crossorigin="anonymous" referrerpolicy="no-referrer"></script> -->

<script src="./pdfmake.min.js"></script>
<script src="./vfs_fonts.min.js"></script>

<script>
  const docDefinition = {
    pageSize: 'A4',
    pageOrientation: 'landscape',
    content: [
      'Hey, it works'
    ],
    pageMargins: [20, 5, 10, 5],
    info: {
      title: 'Some PDF Name',
      author: 'Author Name',
    },
    defaultStyle: {
      fontSize: 9,
      bold: false,
    }
  }

  const pdf = pdfMake.createPdf(docDefinition);
  pdf.open({});
</script>

</html>

如果加载从cdn下载的lib。我还在评论中保留了实际的 CDN 链接。

这里的代码直接写在html文件的script标签内。如果您想将代码保存在单独的 js 文件中,请确保这些文件的脚本标记保留在 libs 之后

<script src="./pdfmake.min.js"></script>
<script src="./vfs_fonts.min.js"></script>
<script src="./index.js"></script>
© www.soinside.com 2019 - 2024. All rights reserved.