Gathering detailed insights and metrics for jspdf
Gathering detailed insights and metrics for jspdf
Gathering detailed insights and metrics for jspdf
Gathering detailed insights and metrics for jspdf
Client-side JavaScript PDF generation for everyone.
npm install jspdf
Typescript
Module System
Node Version
NPM Version
65.5
Supply Chain
97.9
Quality
76
Maintenance
100
Vulnerability
99.3
License
Updated on 05 Dec 2024
JavaScript (96.5%)
TypeScript (2.38%)
HTML (1.13%)
Cumulative downloads
Total Downloads
Last day
5%
Compared to previous day
Last week
-6.8%
Compared to previous week
Last month
11.7%
Compared to previous month
Last year
36.8%
Compared to previous year
4
52
4
A library to generate PDFs in JavaScript.
You can catch me on twitter: @MrRio or head over to my company's website for consultancy.
jsPDF is now co-maintained by yWorks - the diagramming experts.
Recommended: get jsPDF from npm:
1npm install jspdf --save 2# or 3yarn add jspdf
Alternatively, load it from a CDN:
1<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.2/jspdf.umd.min.js"></script>
Or always get latest version via unpkg
1<script src="https://unpkg.com/jspdf@latest/dist/jspdf.umd.min.js"></script>
The dist
folder of this package contains different kinds of files:
core-js
, the umd variant is self-contained.Usually it is not necessary to specify the exact file in the import statement. Build tools or Node automatically figure out the right file, so importing "jspdf" is enough.
Then you're ready to start making your document:
1import { jsPDF } from "jspdf"; 2 3// Default export is a4 paper, portrait, using millimeters for units 4const doc = new jsPDF(); 5 6doc.text("Hello world!", 10, 10); 7doc.save("a4.pdf");
If you want to change the paper size, orientation, or units, you can do:
1// Landscape export, 2×4 inches 2const doc = new jsPDF({ 3 orientation: "landscape", 4 unit: "in", 5 format: [4, 2] 6}); 7 8doc.text("Hello world!", 1, 1); 9doc.save("two-by-four.pdf");
1const { jsPDF } = require("jspdf"); // will automatically load the node version 2 3const doc = new jsPDF(); 4doc.text("Hello world!", 10, 10); 5doc.save("a4.pdf"); // will save the file in the current working directory
1require(["jspdf"], ({ jsPDF }) => { 2 const doc = new jsPDF(); 3 doc.text("Hello world!", 10, 10); 4 doc.save("a4.pdf"); 5});
1const { jsPDF } = window.jspdf; 2 3const doc = new jsPDF(); 4doc.text("Hello world!", 10, 10); 5doc.save("a4.pdf");
Some functions of jsPDF require optional dependencies. E.g. the html
method, which depends on html2canvas
and,
when supplied with a string HTML document, dompurify
. JsPDF loads them dynamically when required
(using the respective module format, e.g. dynamic imports). Build tools like Webpack will automatically create separate
chunks for each of the optional dependencies. If your application does not use any of the optional dependencies, you
can prevent Webpack from generating the chunks by defining them as external dependencies:
1// webpack.config.js 2module.exports = { 3 // ... 4 externals: { 5 // only define the dependencies you are NOT using as externals! 6 canvg: "canvg", 7 html2canvas: "html2canvas", 8 dompurify: "dompurify" 9 } 10};
In Vue CLI projects, externals can be defined via the configureWebpack
or chainWebpack properties of the vue.config.js
file
(needs to be created, first, in fresh projects).
In Angular projects, externals can be defined using custom webpack builders.
In React (create-react-app
) projects, externals can be defined by either using
react-app-rewired or ejecting.
jsPDF can be imported just like any other 3rd party library. This works with all major toolkits and frameworks. jsPDF also offers a typings file for TypeScript projects.
1import { jsPDF } from "jspdf";
You can add jsPDF to your meteor-project as follows:
meteor add jspdf:core
jsPDF requires modern browser APIs in order to function. To use jsPDF in older browsers like Internet Explorer, polyfills are required. You can load all required polyfills as follows:
1import "jspdf/dist/polyfills.es.js";
Alternatively, you can load the prebundled polyfill file. This is not recommended, since you might end up loading polyfills multiple times. Might still be nifty for small applications or quick POCs.
1<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.2/polyfills.umd.js"></script>
The 14 standard fonts in PDF are limited to the ASCII-codepage. If you want to use UTF-8 you have to integrate a custom font, which provides the needed glyphs. jsPDF supports .ttf-files. So if you want to have for example Chinese text in your pdf, your font has to have the necessary Chinese glyphs. So, check if your font supports the wanted glyphs or else it will show garbled characters instead of the right text.
To add the font to jsPDF use our fontconverter in /fontconverter/fontconverter.html. The fontconverter will create a js-file with the content of the provided ttf-file as base64 encoded string and additional code for jsPDF. You just have to add this generated js-File to your project. You are then ready to go to use setFont-method in your code and write your UTF-8 encoded text.
Alternatively you can just load the content of the *.ttf file as a binary string using fetch
or XMLHttpRequest
and
add the font to the PDF file:
1const doc = new jsPDF();
2
3const myFont = ... // load the *.ttf font file as binary string
4
5// add the font to jsPDF
6doc.addFileToVFS("MyFont.ttf", myFont);
7doc.addFont("MyFont.ttf", "MyFont", "normal");
8doc.setFont("MyFont");
Since the merge with the yWorks fork there are a lot of new features. However, some of them are API breaking, which is why there is an API-switch between two API modes:
You can switch between the two modes by calling
1doc.advancedAPI(doc => { 2 // your code 3}); 4// or 5doc.compatAPI(doc => { 6 // your code 7});
JsPDF will automatically switch back to the original API mode after the callback has run.
Please check if your question is already handled at Stackoverflow https://stackoverflow.com/questions/tagged/jspdf.
Feel free to ask a question there with the tag jspdf
.
Feature requests, bug reports, etc. are very welcome as issues. Note that bug reports should follow these guidelines:
jsPDF cannot live without help from the community! If you think a feature is missing or you found a bug, please consider if you can spare one or two hours and prepare a pull request. If you're simply interested in this project and want to help, have a look at the open issues, especially those labeled with "bug".
You can find information about building and testing jsPDF in the contribution guide
Copyright (c) 2010-2021 James Hall, https://github.com/MrRio/jsPDF (c) 2015-2021 yWorks GmbH, https://www.yworks.com/
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
Stable Version
1
7.5/10
Summary
jspdf vulnerable to Regular Expression Denial of Service (ReDoS)
Affected Versions
< 2.3.1
Patched Versions
2.3.1
2
6.1/10
Summary
Cross-site scripting in jspdf
Affected Versions
< 2.0.0
Patched Versions
2.0.0
6.1/10
Summary
Cross-site scripting in jspdf
Affected Versions
< 2.0.0
Patched Versions
2.0.0
Reason
no dangerous workflow patterns detected
Reason
license file detected
Details
Reason
no binaries found in the repo
Reason
security policy file detected
Details
Reason
Found 22/30 approved changesets -- score normalized to 7
Reason
8 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 6
Reason
dependency not pinned by hash detected -- score normalized to 2
Details
Reason
detected GitHub workflow tokens with excessive permissions
Details
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
project is not fuzzed
Details
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
Reason
74 existing vulnerabilities detected
Details
Score
Last Scanned on 2024-12-02
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More