들어가며

프로젝트에서 특정 영역을 인쇄기능이 필요하여 라이브러리를 찾아봤다.
html2pdf.js 라이브러리를 이용해 pdf저장 기능을 사용중이라 인쇄기능도 되는지 찾아봤다.
다행히 지원이 됐다.
하지만 ie11은 지원이 안 된다! (ie11은 이제 그만~~ 하고싶다..)

html2pdf.js 인쇄

import html2pdf from 'html2pdf.js';
const methods = {
  htmlToPdfPrint: location => {
    html2pdf()
      .set({
        margin: [15, 0, 15, 0],
        filename: navigator.userAgent.indexOf('MSIE') !== -1 || navigator.appVersion.indexOf('Trident/') > -1 ? 'print.pdf' : 'print',
        pagebreak: { mode: 'avoid-all' },
        image: { type: 'jpeg', quality: 1 },
        html2canvas: {
          useCORS: true,
          scrollY: 0,
          scale: 1,
          dpi: 300,
          letterRendering: true,
          allowTaint: false, //useCORS를 true로 설정 시 반드시 allowTaint를 false처리 해주어야함
        },
        jsPDF: { orientation: 'portrait', unit: 'mm', format: 'a4' },
      })
      .from(location)
      .toPdf()
      .get('pdf')
      .then(function (pdfObj) {
        pdfObj.autoPrint();
        window.open(pdfObj.output('bloburl'));
      });
  },
};

export default {
  install(Vue) {
    Vue.prototype.$htmlToPdfPrint = methods.htmlToPdfPrint;
  },
};