- 자바스크립트(js)용 , html to pdf converter library list
* MrRio /jsPDF
https://github.com/MrRio/jsPDF - 20.5k
- v2.1.1 , 20/09
- 매뉴얼
http://raw.githack.com/MrRio/jsPDF/master/docs/
- html을 변환에 html2canvas 라이브러리 사용
//-------------------
- 사용법 1 : text
<script src="https://unpkg.com/jspdf@latest/dist/jspdf.umd.min.js"></script>
//import { jsPDF } from "jspdf";//에러! Uncaught SyntaxError: Cannot use import statement outside a modul
window.jsPDF = window.jspdf.jsPDF;
const doc = new jsPDF();
doc.text("Hello world!", 10, 10);
doc.save("a4.pdf");
//------------------------
- 사용법 2 : html
<script src="https://html2canvas.hertzen.com/dist/html2canvas.js"></script>
<script src="https://unpkg.com/jspdf@latest/dist/jspdf.umd.min.js"></script>
<script>
window.jsPDF = window.jspdf.jsPDF;
var pdf = new jsPDF();
pdf.html(document.body, {
callback: function (pdf) {
pdf.save('doc1.pdf');
}
});
//---------------
- 에러 처리
에러 메시지: jspdf html Error: Could not load dompurify: Error: Could not load
해결 방법 : html2canvas 로드
<script src="https://html2canvas.hertzen.com/dist/html2canvas.js"></script>
//------------------------------------------------------
* niklasvh /html2canvas
https://github.com/niklasvh/html2canvas - 22k
- v1.0.0-rc.7 , 20/08
- 복잡한 html문서를 제대로 렌더링 못함(여백 문제)
- 매뉴얼
https://html2canvas.hertzen.com/getting-started
- 사용법
<script type="text/javascript" src="../dist/html2canvas.js"></script>
<script type="text/javascript">
html2canvas(document.body).then(function(canvas) {
document.body.appendChild(canvas);
});
</script>
//----------------------------
* bpampuch /pdfmake
https://github.com/bpampuch/pdfmake - 8.7k
- v0.1.68 , 20/08
- html을 직접 변환 못함
- 매뉴얼
https://pdfmake.github.io/docs/0.1/getting-started/client-side/
https://cdnjs.com/libraries/pdfmake
- 사용법
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.68/pdfmake.min.js"></script>
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 pdf = pdfmake.createPdf(docDefinition);
pdf.write('pdfs/basics.pdf').then(() => {
console.log( '완료');
});
//-------------------------------------
* eKoopmans /html2pdf.js
Client-side HTML-to-PDF rendering using pure JS.
https://github.com/eKoopmans/html2pdf.js - 1.6k
- v0.9.2 , 20/02
- html2canvas , jspdf 가 내부에 포함되어 있음
- 사용예
<script type="text/javascript" src="./dist/html2pdf.bundle.js"></script>
<script type="text/javascript">
var element = document.body;
var opt = {
filename: 'myfile.pdf',
};
html2pdf(element, opt);
//-----------------------
https://github.com/johnnywang1994/jsPDF-html2canvas
//----------------------------------
< Node.js 용>
//----------------------------------------------------------
[Node.js] HTML -> PDF
//--------------------
* foliojs /pdfkit
https://github.com/foliojs/pdfkit - 6.7k
- v0.11.0 , 2020/01
- Node.js 용
- 매뉴얼
- 복잡한 html 직접 변환 기능 없음
//--------------------
* marcbachmann /node-html-pdf
https://github.com/marcbachmann/node-html-pdf - 3k
- v2.2.0 , 2017/09
- 개발 중지 됨
- 커맨드 라인 명령
- 멀티 칼럼 안됨
- 설치
npm install -g html-pdf
- 사용
html-pdf test/businesscard.html businesscard.pdf
//-----------------------
// 참고
https://stackoverflow.com/questions/18191893/generate-pdf-from-html-in-div-using-javascript
'Code > JavaScript' 카테고리의 다른 글
[Electron] 윈도우 크기 위치 기억, 복원 (0) | 2020.11.27 |
---|---|
[Electron] 일렉트론 메뉴, 단축키 사용법 (0) | 2020.11.27 |
[Node.js] HTTP client (0) | 2020.08.24 |
[Node.js] 브라우저 테스팅 툴 NightWatch 사용법 (0) | 2020.08.24 |
[Node.js] puppeteer - 브라우저 제어 사용방법(웹 크롤) (0) | 2020.08.24 |