How to import html2pdf function

[heditrtr]

Are you using the latest version of jsPDF? YES

Have you tried using jspdf.debug.js? YES

Steps to reproduce

• I'v installed jspdf from the npm repo npm install --save jspdf
• I did try to use html2pdf function as global variable.

What I saw

• html2pdf is undefined

Note that this isn't an issue, or we can say that it's a documentation issue. Even though this html2pdf example shows how to use it, but the problem is that it is not delivered within the dist folder.

[tomChapuis-canal]

Same issue here !

[cmgurba]

so what is the proper way to import this in a module based application? aka react, vue, ember etc.

[Uzlopak]

https://github.com/MrRio/jsPDF#angular-configuration ?

[cscanlin]

I believe you may also need to install html2pdf first: npm install --save html2pdf.js

After that, I was able to get it working with: import html2pdf from 'html2pdf.js'

[KaranPato]

html2pdf.js works for some angular projects and do not work for some.

It is working for the below package.json.

{ "name": "footytrivia-ui", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animations": "~9.1.6", "@angular/common": "~9.1.6", "@angular/compiler": "~9.1.6", "@angular/core": "~9.1.6", "@angular/forms": "~9.1.6", "@angular/platform-browser": "~9.1.6", "@angular/platform-browser-dynamic": "~9.1.6", "@angular/router": "~9.1.6", "@ngrx/effects": "^10.0.0", "@ngrx/schematics": "^10.0.0", "@ngrx/store": "^10.0.0", "@ngrx/store-devtools": "^10.0.0", "angularx-social-login": "^2.3.1", "angularx-social-login-ivy": "^1.2.9", "bootstrap": "^4.5.0", "html2pdf.js": "^0.9.3", "ngx-bootstrap": "^5.6.1", "rxjs": "~6.5.4", "tslib": "^1.10.0", "zone.js": "~0.10.2" }, "devDependencies": { "@angular-devkit/build-angular": "~0.901.5", "@angular/cli": "~9.1.5", "@angular/compiler-cli": "~9.1.6", "@types/node": "^12.11.1", "@types/jasmine": "~3.5.0", "@types/jasminewd2": "~2.0.3", "codelyzer": "^5.1.2", "jasmine-core": "~3.5.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~5.0.0", "karma-chrome-launcher": "~3.1.0", "karma-coverage-istanbul-reporter": "~2.1.0", "karma-jasmine": "~3.0.1", "karma-jasmine-html-reporter": "^1.4.2", "protractor": "~5.4.3", "ts-node": "~8.3.0", "tslint": "~6.1.0", "typescript": "~3.8.3" } }

but not for this one.

{ "name": "demo", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "watch": "ng build --watch --configuration development", "test": "ng test" }, "private": true, "dependencies": { "@angular/animations": "~12.0.3", "@angular/cdk": "^12.0.3", "@angular/common": "~12.0.3", "@angular/compiler": "~12.0.3", "@angular/core": "~12.0.3", "@angular/flex-layout": "*", "@angular/forms": "~12.0.3", "@angular/material": "^12.0.3", "@angular/platform-browser": "~12.0.3", "@angular/platform-browser-dynamic": "~12.0.3", "@angular/router": "~12.0.3", "@highcharts/map-collection": "^1.1.3", "@swimlane/ngx-charts": "^18.0.1", "angular2-chartjs": "^0.5.1", "bootstrap": "^5.0.1", "chart.js": "^3.4.0", "chartjs-plugin-annotation": "^1.0.2", "d3": "^7.0.0", "highcharts": "^9.1.2", "highcharts-angular": "^2.10.0", "html2pdf.js": "^0.9.3", "jspdf": "^2.3.1", "ng2-charts": "^2.2.3", "ngx-bootstrap": "^6.2.0", "ngx-spinner": "^12.0.0", "rxjs": "~6.6.0", "tslib": "^2.1.0", "zone.js": "~0.11.4" }, "devDependencies": { "@angular-devkit/build-angular": "~12.0.3", "@angular/cli": "~12.0.3", "@angular/compiler-cli": "~12.0.3", "@types/d3": "^7.0.0", "@types/jasmine": "~3.6.0", "@types/node": "^12.11.1", "jasmine-core": "~3.7.0", "karma": "~6.3.0", "karma-chrome-launcher": "~3.1.0", "karma-coverage": "~2.0.3", "karma-jasmine": "~4.0.0", "karma-jasmine-html-reporter": "^1.5.0", "typescript": "~4.2.3" } }

Let me know if anyone gets it.