Angular 带jsPDF模块的角度9：类型'；jsPDF的类型'；没有构造签名

角度9 发布jsPDF的模块（已安装类型+软件包本身）

当你发球时，它是有效的 在执行ng build--prod时，它有错误

ERROR in src/app/xxx/xxxx.componentomponent.ts:52:27 - error TS2351: This expression is not constructable.
  Type 'typeof jsPDF' has no construct signatures.

52       let pdf = new jsPDF('p', 'mm', 'a4');
                             ~~~~~

  src/app/xxx/xxxx.component.ts:7:1
    7 import * as jsPDF from 'jspdf';
      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Type originates at this import. A namespace-style import cannot be called or constructed, and will cause a failure at runtime. Consider using a default import or import require here instead.

tsconfig文件具有“esModuleInterop”：true

我按如下方式导入模块：

**import * as jsPDF from 'jspdf';**

在我的课堂上这样使用它：

 generatePDF() {
    var data = document.getElementById('contentToConvert');
    html2canvas(data).then(canvas => {
      var imgWidth = 208;
      var imgHeight = canvas.height * imgWidth / canvas.width;
      const contentDataURL = canvas.toDataURL('image/png')
      let pdf = **new jsPDF**('p', 'mm', 'a4');
      var position = 0;
      pdf.addImage(contentDataURL, 'PNG', 0, position, imgWidth, imgHeight)
      pdf.save('skill-set.pdf');
    });
  }

我还尝试在angular.json的scripts部分添加模块js文件

  "scripts": [
              "node_modules/jquery/dist/jquery.min.js",
              "node_modules/bootstrap/dist/js/bootstrap.min.js",
              **"node_modules/jspdf/dist/jspdf.min.js"**
            ]

---

我设置了一个新的angular 10项目，并且能够使用

jspdf

创建新的Angular应用程序

>npx@angular/cli新pdf查看器--严格--默认值为true

从npm注册表安装

jspdf

程序包

cd pdf查看器 >npm安装jspdf--保存 >npm install@types/jspdf--保存开发

更新

tsconfig.base.json

。在

编译器选项中添加
allowSyntheticDefaultImports

在

src/app/app.component.ts

从'@angular/core'导入{Component，ChangeDetectionStrategy}；
从“jsPDF”导入jsPDF；
@组成部分({
选择器：'应用程序根'，
templateUrl:“./app.component.html”，
样式URL:['./app.component.css']，
changeDetection:ChangeDetectionStrategy.OnPush，
})
导出类AppComponent{
标题='pdf查看器'；
构造函数（）{
这个.generatePDF（）；
}
private generatePDF（）：void{
const doc=new jsPDF（）；
doc.text（'helloworld！'，10,10）；
doc.save（'a4.pdf'）；
}
}

启动角度应用程序并导航到

http://localhost:4200

。您会注意到，

a4.pdf

在我们打开网页后立即被下载。打开PDF文件以验证文件的完整性

>npm启动

（在angular 10中进行了测试，因此我猜此修复程序适用于较新的angular版本）

与此相反：

import * as jsPDF from 'jspdf';

import * as jsPDF from 'jspdf';

写下：

import jspdf from 'jspdf';

import JSPDF from 'jspdf';

[小心！第二行的

jspdf

都是小写的]

然后你的

let pdf = new jsPDF('p', 'mm', 'a4'); 

let pdf = new JSPDF.jsPDF(); 

也可以，只需将所有内容更改为小写字母（在执行此操作之前，您必须以小写字母导入，就像我的第二个导入行一样）

与此相反：

import * as jsPDF from 'jspdf';

import * as jsPDF from 'jspdf';

写下：

import jspdf from 'jspdf';

import JSPDF from 'jspdf';

然后你的

let pdf = new jsPDF('p', 'mm', 'a4'); 

let pdf = new JSPDF.jsPDF(); 

就这样吧： 从“jsPDF”导入{jsPDF}

//并初始化JSPDF var doc=新的jsPDF（“p”、“mm”、“a4”）

---

//这对我来说很有用

试着将jsPDF安装为节点模块：

npm install-S jsPDF

并从

angular.json

中删除脚本导入我最初使用npm install jsPDF完成了这项工作——保存然后像模块一样尝试。你也安装了

@types/jsPDF

？@David是的，我安装了。我发现了问题所在，我发送了两个参数，正如我在网上的一篇文章中所发现的**新的jsPDF**（“p”、“mm”、“a4”）；删除参数，解决了我认为是错误的问题。在我的代码中，我传递了一些参数“newjspdf**（'p'，'mm'，'a4'），正如我在一些示例中所发现的那样。这实际上就是问题所在。一旦我更改为**新jsPDF**（）声明，错误就消失了