[{"data":1,"prerenderedAt":1459},["ShallowReactive",2],{"navigation_docs":3,"-versions-1-1-1-use-cases-vue-html-to-pdf":236,"-versions-1-1-1-use-cases-vue-html-to-pdf-surround":1456},[4,63,109,159],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":62},"API","i-lucide-braces","\u002Fapi","api",[10,14,18,22,26,30,34,38,42,46,50,54,58],{"title":11,"path":12,"stem":13},"Html2Pdf Component","\u002Fapi\u002Fcomponent","api\u002F01.component",{"title":15,"path":16,"stem":17},"Core Props","\u002Fapi\u002Fprops","api\u002F02.props",{"title":19,"path":20,"stem":21},"PDF Headers in Vue","\u002Fapi\u002Fheaders","api\u002F03.headers",{"title":23,"path":24,"stem":25},"PDF Footers in Vue","\u002Fapi\u002Ffooters","api\u002F04.footers",{"title":27,"path":28,"stem":29},"Security","\u002Fapi\u002Fsecurity","api\u002F05.security",{"title":31,"path":32,"stem":33},"Watermarks","\u002Fapi\u002Fwatermarks","api\u002F06.watermarks",{"title":35,"path":36,"stem":37},"Metadata & Compression","\u002Fapi\u002Fmetadata-compression","api\u002F07.metadata-compression",{"title":39,"path":40,"stem":41},"Programmatic API","\u002Fapi\u002Fprogrammatic-api","api\u002F08.programmatic-api",{"title":43,"path":44,"stem":45},"Loader, Progress, Metrics, Events & Slots","\u002Fapi\u002Fevents-slots","api\u002F09.events-slots",{"title":47,"path":48,"stem":49},"TypeScript","\u002Fapi\u002Ftypescript","api\u002F10.typescript",{"title":51,"path":52,"stem":53},"PDF Styling & data-pdf-ignore","\u002Fapi\u002Fpdf-styling","api\u002F11.pdf-styling",{"title":55,"path":56,"stem":57},"API Reference","\u002Fapi\u002Ffull-reference","api\u002F12.full-reference",{"title":59,"path":60,"stem":61},"Compose Existing PDF Pages","\u002Fapi\u002Fcomposition","api\u002F13.composition",false,{"title":64,"icon":65,"path":66,"stem":67,"children":68,"page":62},"Get Started","i-lucide-book-open","\u002Fget-started","get-started",[69,73,77,81,85,89,93,97,101,105],{"title":70,"path":71,"stem":72},"Introduction","\u002Fget-started\u002Fintroduction","get-started\u002F01.introduction",{"title":74,"path":75,"stem":76},"Installation","\u002Fget-started\u002Finstallation","get-started\u002F02.installation",{"title":78,"path":79,"stem":80},"Quick Start","\u002Fget-started\u002Fquick-start","get-started\u002F03.quick-start",{"title":82,"path":83,"stem":84},"Rendering Modes","\u002Fget-started\u002Frendering-modes","get-started\u002F04.rendering-modes",{"title":86,"path":87,"stem":88},"Component Registration","\u002Fget-started\u002Fregistration","get-started\u002F05.registration",{"title":90,"path":91,"stem":92},"Preview & Download","\u002Fget-started\u002Fpreview-download","get-started\u002F06.preview-download",{"title":94,"path":95,"stem":96},"Smart PDF Pagination","\u002Fget-started\u002Fpagination","get-started\u002F07.pagination",{"title":98,"path":99,"stem":100},"Nuxt 3 & Nuxt 4 SSR","\u002Fget-started\u002Fnuxt-ssr","get-started\u002F08.nuxt-ssr",{"title":102,"path":103,"stem":104},"Migration Guide","\u002Fget-started\u002Fmigration","get-started\u002F09.migration",{"title":106,"path":107,"stem":108},"PDF Paper Formats and Orientation","\u002Fget-started\u002Fpaper-formats","get-started\u002F10.paper-formats",{"title":110,"icon":111,"path":112,"stem":113,"children":114,"page":62},"Use Cases","i-lucide-flask-conical","\u002Fuse-cases","use-cases",[115,119,123,127,131,135,139,143,147,151,155],{"title":116,"path":117,"stem":118},"Playground","\u002Fuse-cases\u002Fplayground","use-cases\u002F01.playground",{"title":120,"path":121,"stem":122},"Selectable Text Mode","\u002Fuse-cases\u002Fselectable-text","use-cases\u002F02.selectable-text",{"title":124,"path":125,"stem":126},"Clickable PDF Links","\u002Fuse-cases\u002Fclickable-links","use-cases\u002F03.clickable-links",{"title":128,"path":129,"stem":130},"Images & CORS","\u002Fuse-cases\u002Fimages-cors","use-cases\u002F04.images-cors",{"title":132,"path":133,"stem":134},"Production Guide","\u002Fuse-cases\u002Fproduction-guide","use-cases\u002F05.production-guide",{"title":136,"path":137,"stem":138},"Troubleshooting","\u002Fuse-cases\u002Ftroubleshooting","use-cases\u002F06.troubleshooting",{"title":140,"path":141,"stem":142},"Testing & Browser Support","\u002Fuse-cases\u002Ftesting-browser-support","use-cases\u002F07.testing-browser-support",{"title":144,"path":145,"stem":146},"Performance Engineering","\u002Fuse-cases\u002Fperformance-engineering","use-cases\u002F08.performance-engineering",{"title":148,"path":149,"stem":150},"Full Performance Engineering Report","\u002Fuse-cases\u002Fperformance-report","use-cases\u002F09.performance-report",{"title":152,"path":153,"stem":154},"Community & Feedback","\u002Fuse-cases\u002Fcommunity","use-cases\u002F10.community",{"title":156,"path":157,"stem":158},"Acknowledgements","\u002Fuse-cases\u002Facknowledgements","use-cases\u002F11.acknowledgements",{"title":160,"path":161,"stem":162,"children":163,"page":62},"Versions","\u002Fversions","versions",[164],{"title":165,"path":166,"stem":167,"children":168},"v1 Documentation","\u002Fversions\u002F1.1.1","versions\u002F1.1.1\u002Findex",[169,170,202,216],{"title":165,"path":166,"stem":167},{"title":171,"path":172,"stem":173,"children":174,"page":62},"Api","\u002Fversions\u002F1.1.1\u002Fapi","versions\u002F1.1.1\u002Fapi",[175,178,181,185,189,192,195,198],{"title":11,"path":176,"stem":177},"\u002Fversions\u002F1.1.1\u002Fapi\u002Fcomponent","versions\u002F1.1.1\u002Fapi\u002F01.component",{"title":15,"path":179,"stem":180},"\u002Fversions\u002F1.1.1\u002Fapi\u002Fprops","versions\u002F1.1.1\u002Fapi\u002F02.props",{"title":182,"path":183,"stem":184},"Headers","\u002Fversions\u002F1.1.1\u002Fapi\u002Fheaders","versions\u002F1.1.1\u002Fapi\u002F03.headers",{"title":186,"path":187,"stem":188},"Footers","\u002Fversions\u002F1.1.1\u002Fapi\u002Ffooters","versions\u002F1.1.1\u002Fapi\u002F04.footers",{"title":39,"path":190,"stem":191},"\u002Fversions\u002F1.1.1\u002Fapi\u002Fprogrammatic-api","versions\u002F1.1.1\u002Fapi\u002F08.programmatic-api",{"title":43,"path":193,"stem":194},"\u002Fversions\u002F1.1.1\u002Fapi\u002Fevents-slots","versions\u002F1.1.1\u002Fapi\u002F09.events-slots",{"title":47,"path":196,"stem":197},"\u002Fversions\u002F1.1.1\u002Fapi\u002Ftypescript","versions\u002F1.1.1\u002Fapi\u002F10.typescript",{"title":199,"path":200,"stem":201},"Full README Reference","\u002Fversions\u002F1.1.1\u002Fapi\u002Ffull-reference","versions\u002F1.1.1\u002Fapi\u002F12.full-reference",{"title":64,"path":203,"stem":204,"children":205,"page":62},"\u002Fversions\u002F1.1.1\u002Fget-started","versions\u002F1.1.1\u002Fget-started",[206,209,212],{"title":70,"path":207,"stem":208},"\u002Fversions\u002F1.1.1\u002Fget-started\u002Fintroduction","versions\u002F1.1.1\u002Fget-started\u002F01.introduction",{"title":82,"path":210,"stem":211},"\u002Fversions\u002F1.1.1\u002Fget-started\u002Frendering-modes","versions\u002F1.1.1\u002Fget-started\u002F04.rendering-modes",{"title":213,"path":214,"stem":215},"Pagination","\u002Fversions\u002F1.1.1\u002Fget-started\u002Fpagination","versions\u002F1.1.1\u002Fget-started\u002F07.pagination",{"title":110,"path":217,"stem":218,"children":219,"page":62},"\u002Fversions\u002F1.1.1\u002Fuse-cases","versions\u002F1.1.1\u002Fuse-cases",[220,223,226,229,232],{"title":116,"path":221,"stem":222},"\u002Fversions\u002F1.1.1\u002Fuse-cases\u002Fplayground","versions\u002F1.1.1\u002Fuse-cases\u002F01.playground",{"title":136,"path":224,"stem":225},"\u002Fversions\u002F1.1.1\u002Fuse-cases\u002Ftroubleshooting","versions\u002F1.1.1\u002Fuse-cases\u002F06.troubleshooting",{"title":140,"path":227,"stem":228},"\u002Fversions\u002F1.1.1\u002Fuse-cases\u002Ftesting-browser-support","versions\u002F1.1.1\u002Fuse-cases\u002F07.testing-browser-support",{"title":144,"path":230,"stem":231},"\u002Fversions\u002F1.1.1\u002Fuse-cases\u002Fperformance-engineering","versions\u002F1.1.1\u002Fuse-cases\u002F08.performance-engineering",{"title":233,"path":234,"stem":235},"Vue HTML to PDF Examples","\u002Fversions\u002F1.1.1\u002Fuse-cases\u002Fvue-html-to-pdf","versions\u002F1.1.1\u002Fuse-cases\u002F12.vue-html-to-pdf",{"id":237,"title":233,"body":238,"description":1448,"extension":1449,"links":1450,"meta":1451,"navigation":387,"path":234,"seo":1452,"stem":235,"__hash__":1455},"docs\u002Fversions\u002F1.1.1\u002Fuse-cases\u002F12.vue-html-to-pdf.md",{"type":239,"value":240,"toc":1442},"minimark",[241,266,271,278,640,648,652,659,919,927,931,938,1404,1421,1425,1438],[242,243,244,248,249,256,257,261,262,265],"p",{},[245,246,247],"code",{},"vue-pdf-export"," is a Vue 3 and TypeScript browser PDF package available on ",[250,251,255],"a",{"href":252,"rel":253},"https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fvue-pdf-export",[254],"nofollow","npm",". These examples use the ",[258,259,260],"strong",{},"v1 API"," for installations up to 1.1.1. The ",[250,263,264],{"href":103},"migration guide"," explains object layers, Vue slots, composition and smart pagination in the current release.",[267,268,270],"h2",{"id":269},"_1-vue-pdf-with-selectable-text","1. Vue PDF with selectable text",[242,272,273,274,277],{},"Set ",[245,275,276],{},"render-mode=\"text\""," to generate supported document text as native PDF text. Canvas mode instead captures visual page images.",[279,280,285],"pre",{"className":281,"code":282,"language":283,"meta":284,"style":284},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { ref } from 'vue'\nimport { Html2Pdf } from 'vue-pdf-export'\nimport 'vue-pdf-export\u002Fstyle.css'\n\nconst pdf = ref\u003CInstanceType\u003Ctypeof Html2Pdf> | null>(null)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003Cbutton type=\"button\" @click=\"pdf?.generatePdf()\">Export report\u003C\u002Fbutton>\n  \u003CHtml2Pdf ref=\"pdf\" render-mode=\"text\" :manual-pagination=\"true\" filename=\"report.pdf\">\n    \u003Ctemplate #pdf-content>\u003Carticle>\u003Ch1>Report\u003C\u002Fh1>\u003Cp>Select or search this PDF text.\u003C\u002Fp>\u003C\u002Farticle>\u003C\u002Ftemplate>\n  \u003C\u002FHtml2Pdf>\n\u003C\u002Ftemplate>\n","vue","",[245,286,287,322,350,370,382,389,434,444,449,459,502,563,621,631],{"__ignoreMap":284},[288,289,292,296,300,304,307,310,313,317,319],"span",{"class":290,"line":291},"line",1,[288,293,295],{"class":294},"sMK4o","\u003C",[288,297,299],{"class":298},"swJcz","script",[288,301,303],{"class":302},"spNyl"," setup",[288,305,306],{"class":302}," lang",[288,308,309],{"class":294},"=",[288,311,312],{"class":294},"\"",[288,314,316],{"class":315},"sfazB","ts",[288,318,312],{"class":294},[288,320,321],{"class":294},">\n",[288,323,325,329,332,336,339,342,345,347],{"class":290,"line":324},2,[288,326,328],{"class":327},"s7zQu","import",[288,330,331],{"class":294}," {",[288,333,335],{"class":334},"sTEyZ"," ref",[288,337,338],{"class":294}," }",[288,340,341],{"class":327}," from",[288,343,344],{"class":294}," '",[288,346,283],{"class":315},[288,348,349],{"class":294},"'\n",[288,351,353,355,357,360,362,364,366,368],{"class":290,"line":352},3,[288,354,328],{"class":327},[288,356,331],{"class":294},[288,358,359],{"class":334}," Html2Pdf",[288,361,338],{"class":294},[288,363,341],{"class":327},[288,365,344],{"class":294},[288,367,247],{"class":315},[288,369,349],{"class":294},[288,371,373,375,377,380],{"class":290,"line":372},4,[288,374,328],{"class":327},[288,376,344],{"class":294},[288,378,379],{"class":315},"vue-pdf-export\u002Fstyle.css",[288,381,349],{"class":294},[288,383,385],{"class":290,"line":384},5,[288,386,388],{"emptyLinePlaceholder":387},true,"\n",[288,390,392,395,398,400,403,405,409,412,414,417,420,423,425,428,431],{"class":290,"line":391},6,[288,393,394],{"class":302},"const",[288,396,397],{"class":334}," pdf ",[288,399,309],{"class":294},[288,401,335],{"class":402},"s2Zo4",[288,404,295],{"class":294},[288,406,408],{"class":407},"sBMFI","InstanceType",[288,410,411],{"class":294},"\u003Ctypeof",[288,413,359],{"class":334},[288,415,416],{"class":294},">",[288,418,419],{"class":294}," |",[288,421,422],{"class":407}," null",[288,424,416],{"class":294},[288,426,427],{"class":334},"(",[288,429,430],{"class":294},"null",[288,432,433],{"class":334},")\n",[288,435,437,440,442],{"class":290,"line":436},7,[288,438,439],{"class":294},"\u003C\u002F",[288,441,299],{"class":298},[288,443,321],{"class":294},[288,445,447],{"class":290,"line":446},8,[288,448,388],{"emptyLinePlaceholder":387},[288,450,452,454,457],{"class":290,"line":451},9,[288,453,295],{"class":294},[288,455,456],{"class":298},"template",[288,458,321],{"class":294},[288,460,462,465,468,471,473,475,477,479,482,484,486,489,491,493,496,498,500],{"class":290,"line":461},10,[288,463,464],{"class":294},"  \u003C",[288,466,467],{"class":298},"button",[288,469,470],{"class":302}," type",[288,472,309],{"class":294},[288,474,312],{"class":294},[288,476,467],{"class":315},[288,478,312],{"class":294},[288,480,481],{"class":302}," @click",[288,483,309],{"class":294},[288,485,312],{"class":294},[288,487,488],{"class":315},"pdf?.generatePdf()",[288,490,312],{"class":294},[288,492,416],{"class":294},[288,494,495],{"class":334},"Export report",[288,497,439],{"class":294},[288,499,467],{"class":298},[288,501,321],{"class":294},[288,503,505,507,510,512,514,516,519,521,524,526,528,531,533,536,539,541,543,547,549,552,554,556,559,561],{"class":290,"line":504},11,[288,506,464],{"class":294},[288,508,509],{"class":298},"Html2Pdf",[288,511,335],{"class":302},[288,513,309],{"class":294},[288,515,312],{"class":294},[288,517,518],{"class":315},"pdf",[288,520,312],{"class":294},[288,522,523],{"class":302}," render-mode",[288,525,309],{"class":294},[288,527,312],{"class":294},[288,529,530],{"class":315},"text",[288,532,312],{"class":294},[288,534,535],{"class":294}," :",[288,537,538],{"class":302},"manual-pagination",[288,540,309],{"class":294},[288,542,312],{"class":294},[288,544,546],{"class":545},"sfNiH","true",[288,548,312],{"class":294},[288,550,551],{"class":302}," filename",[288,553,309],{"class":294},[288,555,312],{"class":294},[288,557,558],{"class":315},"report.pdf",[288,560,312],{"class":294},[288,562,321],{"class":294},[288,564,566,569,571,574,577,580,583,585,588,590,593,595,597,599,601,603,606,608,610,613,615,617,619],{"class":290,"line":565},12,[288,567,568],{"class":294},"    \u003C",[288,570,456],{"class":298},[288,572,573],{"class":294}," #",[288,575,576],{"class":302},"pdf-content",[288,578,579],{"class":294},">\u003C",[288,581,582],{"class":298},"article",[288,584,579],{"class":294},[288,586,587],{"class":298},"h1",[288,589,416],{"class":294},[288,591,592],{"class":334},"Report",[288,594,439],{"class":294},[288,596,587],{"class":298},[288,598,579],{"class":294},[288,600,242],{"class":298},[288,602,416],{"class":294},[288,604,605],{"class":334},"Select or search this PDF text.",[288,607,439],{"class":294},[288,609,242],{"class":298},[288,611,612],{"class":294},">\u003C\u002F",[288,614,582],{"class":298},[288,616,612],{"class":294},[288,618,456],{"class":298},[288,620,321],{"class":294},[288,622,624,627,629],{"class":290,"line":623},13,[288,625,626],{"class":294},"  \u003C\u002F",[288,628,509],{"class":298},[288,630,321],{"class":294},[288,632,634,636,638],{"class":290,"line":633},14,[288,635,439],{"class":294},[288,637,456],{"class":298},[288,639,321],{"class":294},[242,641,642,643,647],{},"Text mode supports a narrower CSS subset than Canvas. See the ",[250,644,646],{"href":645},"\u002Fget-started\u002Frendering-modes?version=v1","rendering modes guide",".",[267,649,651],{"id":650},"_2-nuxt-3-or-nuxt-4-pdf-export","2. Nuxt 3 or Nuxt 4 PDF export",[242,653,654,655,658],{},"Package imports are SSR-safe. Generate only from a browser event; ",[245,656,657],{},"\u003CClientOnly>"," is useful when the export UI does not need server rendering.",[279,660,662],{"className":281,"code":661,"language":283,"meta":284,"style":284},"\u003Cscript setup lang=\"ts\">\nimport { ref } from 'vue'\nimport { Html2Pdf } from 'vue-pdf-export'\nimport 'vue-pdf-export\u002Fstyle.css'\n\nconst pdf = ref\u003CInstanceType\u003Ctypeof Html2Pdf> | null>(null)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CClientOnly>\n    \u003Cbutton type=\"button\" @click=\"pdf?.generatePdf()\">Export PDF\u003C\u002Fbutton>\n    \u003CHtml2Pdf ref=\"pdf\" :manual-pagination=\"true\">\n      \u003Ctemplate #pdf-content>\u003Carticle>Nuxt browser PDF\u003C\u002Farticle>\u003C\u002Ftemplate>\n    \u003C\u002FHtml2Pdf>\n  \u003C\u002FClientOnly>\n\u003C\u002Ftemplate>\n",[245,663,664,684,702,720,730,734,766,774,778,786,795,832,862,892,901,910],{"__ignoreMap":284},[288,665,666,668,670,672,674,676,678,680,682],{"class":290,"line":291},[288,667,295],{"class":294},[288,669,299],{"class":298},[288,671,303],{"class":302},[288,673,306],{"class":302},[288,675,309],{"class":294},[288,677,312],{"class":294},[288,679,316],{"class":315},[288,681,312],{"class":294},[288,683,321],{"class":294},[288,685,686,688,690,692,694,696,698,700],{"class":290,"line":324},[288,687,328],{"class":327},[288,689,331],{"class":294},[288,691,335],{"class":334},[288,693,338],{"class":294},[288,695,341],{"class":327},[288,697,344],{"class":294},[288,699,283],{"class":315},[288,701,349],{"class":294},[288,703,704,706,708,710,712,714,716,718],{"class":290,"line":352},[288,705,328],{"class":327},[288,707,331],{"class":294},[288,709,359],{"class":334},[288,711,338],{"class":294},[288,713,341],{"class":327},[288,715,344],{"class":294},[288,717,247],{"class":315},[288,719,349],{"class":294},[288,721,722,724,726,728],{"class":290,"line":372},[288,723,328],{"class":327},[288,725,344],{"class":294},[288,727,379],{"class":315},[288,729,349],{"class":294},[288,731,732],{"class":290,"line":384},[288,733,388],{"emptyLinePlaceholder":387},[288,735,736,738,740,742,744,746,748,750,752,754,756,758,760,762,764],{"class":290,"line":391},[288,737,394],{"class":302},[288,739,397],{"class":334},[288,741,309],{"class":294},[288,743,335],{"class":402},[288,745,295],{"class":294},[288,747,408],{"class":407},[288,749,411],{"class":294},[288,751,359],{"class":334},[288,753,416],{"class":294},[288,755,419],{"class":294},[288,757,422],{"class":407},[288,759,416],{"class":294},[288,761,427],{"class":334},[288,763,430],{"class":294},[288,765,433],{"class":334},[288,767,768,770,772],{"class":290,"line":436},[288,769,439],{"class":294},[288,771,299],{"class":298},[288,773,321],{"class":294},[288,775,776],{"class":290,"line":446},[288,777,388],{"emptyLinePlaceholder":387},[288,779,780,782,784],{"class":290,"line":451},[288,781,295],{"class":294},[288,783,456],{"class":298},[288,785,321],{"class":294},[288,787,788,790,793],{"class":290,"line":461},[288,789,464],{"class":294},[288,791,792],{"class":298},"ClientOnly",[288,794,321],{"class":294},[288,796,797,799,801,803,805,807,809,811,813,815,817,819,821,823,826,828,830],{"class":290,"line":504},[288,798,568],{"class":294},[288,800,467],{"class":298},[288,802,470],{"class":302},[288,804,309],{"class":294},[288,806,312],{"class":294},[288,808,467],{"class":315},[288,810,312],{"class":294},[288,812,481],{"class":302},[288,814,309],{"class":294},[288,816,312],{"class":294},[288,818,488],{"class":315},[288,820,312],{"class":294},[288,822,416],{"class":294},[288,824,825],{"class":334},"Export PDF",[288,827,439],{"class":294},[288,829,467],{"class":298},[288,831,321],{"class":294},[288,833,834,836,838,840,842,844,846,848,850,852,854,856,858,860],{"class":290,"line":565},[288,835,568],{"class":294},[288,837,509],{"class":298},[288,839,335],{"class":302},[288,841,309],{"class":294},[288,843,312],{"class":294},[288,845,518],{"class":315},[288,847,312],{"class":294},[288,849,535],{"class":294},[288,851,538],{"class":302},[288,853,309],{"class":294},[288,855,312],{"class":294},[288,857,546],{"class":545},[288,859,312],{"class":294},[288,861,321],{"class":294},[288,863,864,867,869,871,873,875,877,879,882,884,886,888,890],{"class":290,"line":623},[288,865,866],{"class":294},"      \u003C",[288,868,456],{"class":298},[288,870,573],{"class":294},[288,872,576],{"class":302},[288,874,579],{"class":294},[288,876,582],{"class":298},[288,878,416],{"class":294},[288,880,881],{"class":334},"Nuxt browser PDF",[288,883,439],{"class":294},[288,885,582],{"class":298},[288,887,612],{"class":294},[288,889,456],{"class":298},[288,891,321],{"class":294},[288,893,894,897,899],{"class":290,"line":633},[288,895,896],{"class":294},"    \u003C\u002F",[288,898,509],{"class":298},[288,900,321],{"class":294},[288,902,904,906,908],{"class":290,"line":903},15,[288,905,626],{"class":294},[288,907,792],{"class":298},[288,909,321],{"class":294},[288,911,913,915,917],{"class":290,"line":912},16,[288,914,439],{"class":294},[288,916,456],{"class":298},[288,918,321],{"class":294},[242,920,921,922,926],{},"See the ",[250,923,925],{"href":924},"\u002Fget-started\u002Fnuxt-ssr?version=v1","Nuxt SSR guide"," for hydration and lazy-loading patterns.",[267,928,930],{"id":929},"_3-page-break-header-footer-and-blob","3. Page break, header, footer and Blob",[242,932,933,934,937],{},"The 1.1.1 component uses direct layer props. Disable download when your application handles the returned ",[245,935,936],{},"Blob"," itself.",[279,939,941],{"className":281,"code":940,"language":283,"meta":284,"style":284},"\u003Cscript setup lang=\"ts\">\nimport { ref } from 'vue'\nimport { Html2Pdf } from 'vue-pdf-export'\nimport 'vue-pdf-export\u002Fstyle.css'\n\nconst pdf = ref\u003CInstanceType\u003Ctypeof Html2Pdf> | null>(null)\nasync function getBlob() {\n  const blob = await pdf.value?.generatePdf()\n  if (blob) console.log(blob.size)\n}\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003Cbutton type=\"button\" @click=\"getBlob\">Generate Blob\u003C\u002Fbutton>\n  \u003CHtml2Pdf ref=\"pdf\" :enable-download=\"false\" :manual-pagination=\"true\"\n    :inject-header=\"true\" header-text=\"Quarterly report\"\n    :inject-footer=\"true\" footer-mode=\"text\" footer-template=\"Page {n} of {total}\">\n    \u003Ctemplate #pdf-content>\n      \u003Csection>Page one\u003C\u002Fsection>\n      \u003Cdiv class=\"html2pdf__page-break\">\u003C\u002Fdiv>\n      \u003Csection>Page two\u003C\u002Fsection>\n    \u003C\u002Ftemplate>\n  \u003C\u002FHtml2Pdf>\n\u003C\u002Ftemplate>\n",[245,942,943,963,981,999,1009,1013,1045,1062,1093,1126,1131,1139,1143,1151,1189,1232,1260,1301,1314,1333,1359,1377,1386,1395],{"__ignoreMap":284},[288,944,945,947,949,951,953,955,957,959,961],{"class":290,"line":291},[288,946,295],{"class":294},[288,948,299],{"class":298},[288,950,303],{"class":302},[288,952,306],{"class":302},[288,954,309],{"class":294},[288,956,312],{"class":294},[288,958,316],{"class":315},[288,960,312],{"class":294},[288,962,321],{"class":294},[288,964,965,967,969,971,973,975,977,979],{"class":290,"line":324},[288,966,328],{"class":327},[288,968,331],{"class":294},[288,970,335],{"class":334},[288,972,338],{"class":294},[288,974,341],{"class":327},[288,976,344],{"class":294},[288,978,283],{"class":315},[288,980,349],{"class":294},[288,982,983,985,987,989,991,993,995,997],{"class":290,"line":352},[288,984,328],{"class":327},[288,986,331],{"class":294},[288,988,359],{"class":334},[288,990,338],{"class":294},[288,992,341],{"class":327},[288,994,344],{"class":294},[288,996,247],{"class":315},[288,998,349],{"class":294},[288,1000,1001,1003,1005,1007],{"class":290,"line":372},[288,1002,328],{"class":327},[288,1004,344],{"class":294},[288,1006,379],{"class":315},[288,1008,349],{"class":294},[288,1010,1011],{"class":290,"line":384},[288,1012,388],{"emptyLinePlaceholder":387},[288,1014,1015,1017,1019,1021,1023,1025,1027,1029,1031,1033,1035,1037,1039,1041,1043],{"class":290,"line":391},[288,1016,394],{"class":302},[288,1018,397],{"class":334},[288,1020,309],{"class":294},[288,1022,335],{"class":402},[288,1024,295],{"class":294},[288,1026,408],{"class":407},[288,1028,411],{"class":294},[288,1030,359],{"class":334},[288,1032,416],{"class":294},[288,1034,419],{"class":294},[288,1036,422],{"class":407},[288,1038,416],{"class":294},[288,1040,427],{"class":334},[288,1042,430],{"class":294},[288,1044,433],{"class":334},[288,1046,1047,1050,1053,1056,1059],{"class":290,"line":436},[288,1048,1049],{"class":302},"async",[288,1051,1052],{"class":302}," function",[288,1054,1055],{"class":402}," getBlob",[288,1057,1058],{"class":294},"()",[288,1060,1061],{"class":294}," {\n",[288,1063,1064,1067,1070,1073,1076,1079,1081,1084,1087,1090],{"class":290,"line":446},[288,1065,1066],{"class":302},"  const",[288,1068,1069],{"class":334}," blob",[288,1071,1072],{"class":294}," =",[288,1074,1075],{"class":327}," await",[288,1077,1078],{"class":334}," pdf",[288,1080,647],{"class":294},[288,1082,1083],{"class":334},"value",[288,1085,1086],{"class":294},"?.",[288,1088,1089],{"class":402},"generatePdf",[288,1091,1092],{"class":298},"()\n",[288,1094,1095,1098,1101,1104,1107,1110,1112,1115,1117,1119,1121,1124],{"class":290,"line":451},[288,1096,1097],{"class":327},"  if",[288,1099,1100],{"class":298}," (",[288,1102,1103],{"class":334},"blob",[288,1105,1106],{"class":298},") ",[288,1108,1109],{"class":334},"console",[288,1111,647],{"class":294},[288,1113,1114],{"class":402},"log",[288,1116,427],{"class":298},[288,1118,1103],{"class":334},[288,1120,647],{"class":294},[288,1122,1123],{"class":334},"size",[288,1125,433],{"class":298},[288,1127,1128],{"class":290,"line":461},[288,1129,1130],{"class":294},"}\n",[288,1132,1133,1135,1137],{"class":290,"line":504},[288,1134,439],{"class":294},[288,1136,299],{"class":298},[288,1138,321],{"class":294},[288,1140,1141],{"class":290,"line":565},[288,1142,388],{"emptyLinePlaceholder":387},[288,1144,1145,1147,1149],{"class":290,"line":623},[288,1146,295],{"class":294},[288,1148,456],{"class":298},[288,1150,321],{"class":294},[288,1152,1153,1155,1157,1159,1161,1163,1165,1167,1169,1171,1173,1176,1178,1180,1183,1185,1187],{"class":290,"line":633},[288,1154,464],{"class":294},[288,1156,467],{"class":298},[288,1158,470],{"class":302},[288,1160,309],{"class":294},[288,1162,312],{"class":294},[288,1164,467],{"class":315},[288,1166,312],{"class":294},[288,1168,481],{"class":302},[288,1170,309],{"class":294},[288,1172,312],{"class":294},[288,1174,1175],{"class":315},"getBlob",[288,1177,312],{"class":294},[288,1179,416],{"class":294},[288,1181,1182],{"class":334},"Generate Blob",[288,1184,439],{"class":294},[288,1186,467],{"class":298},[288,1188,321],{"class":294},[288,1190,1191,1193,1195,1197,1199,1201,1203,1205,1207,1210,1212,1214,1217,1219,1221,1223,1225,1227,1229],{"class":290,"line":903},[288,1192,464],{"class":294},[288,1194,509],{"class":298},[288,1196,335],{"class":302},[288,1198,309],{"class":294},[288,1200,312],{"class":294},[288,1202,518],{"class":315},[288,1204,312],{"class":294},[288,1206,535],{"class":294},[288,1208,1209],{"class":302},"enable-download",[288,1211,309],{"class":294},[288,1213,312],{"class":294},[288,1215,1216],{"class":545},"false",[288,1218,312],{"class":294},[288,1220,535],{"class":294},[288,1222,538],{"class":302},[288,1224,309],{"class":294},[288,1226,312],{"class":294},[288,1228,546],{"class":545},[288,1230,1231],{"class":294},"\"\n",[288,1233,1234,1237,1240,1242,1244,1246,1248,1251,1253,1255,1258],{"class":290,"line":912},[288,1235,1236],{"class":294},"    :",[288,1238,1239],{"class":302},"inject-header",[288,1241,309],{"class":294},[288,1243,312],{"class":294},[288,1245,546],{"class":545},[288,1247,312],{"class":294},[288,1249,1250],{"class":302}," header-text",[288,1252,309],{"class":294},[288,1254,312],{"class":294},[288,1256,1257],{"class":315},"Quarterly report",[288,1259,1231],{"class":294},[288,1261,1263,1265,1268,1270,1272,1274,1276,1279,1281,1283,1285,1287,1290,1292,1294,1297,1299],{"class":290,"line":1262},17,[288,1264,1236],{"class":294},[288,1266,1267],{"class":302},"inject-footer",[288,1269,309],{"class":294},[288,1271,312],{"class":294},[288,1273,546],{"class":545},[288,1275,312],{"class":294},[288,1277,1278],{"class":302}," footer-mode",[288,1280,309],{"class":294},[288,1282,312],{"class":294},[288,1284,530],{"class":315},[288,1286,312],{"class":294},[288,1288,1289],{"class":302}," footer-template",[288,1291,309],{"class":294},[288,1293,312],{"class":294},[288,1295,1296],{"class":315},"Page {n} of {total}",[288,1298,312],{"class":294},[288,1300,321],{"class":294},[288,1302,1304,1306,1308,1310,1312],{"class":290,"line":1303},18,[288,1305,568],{"class":294},[288,1307,456],{"class":298},[288,1309,573],{"class":294},[288,1311,576],{"class":302},[288,1313,321],{"class":294},[288,1315,1317,1319,1322,1324,1327,1329,1331],{"class":290,"line":1316},19,[288,1318,866],{"class":294},[288,1320,1321],{"class":298},"section",[288,1323,416],{"class":294},[288,1325,1326],{"class":334},"Page one",[288,1328,439],{"class":294},[288,1330,1321],{"class":298},[288,1332,321],{"class":294},[288,1334,1336,1338,1341,1344,1346,1348,1351,1353,1355,1357],{"class":290,"line":1335},20,[288,1337,866],{"class":294},[288,1339,1340],{"class":298},"div",[288,1342,1343],{"class":302}," class",[288,1345,309],{"class":294},[288,1347,312],{"class":294},[288,1349,1350],{"class":315},"html2pdf__page-break",[288,1352,312],{"class":294},[288,1354,612],{"class":294},[288,1356,1340],{"class":298},[288,1358,321],{"class":294},[288,1360,1362,1364,1366,1368,1371,1373,1375],{"class":290,"line":1361},21,[288,1363,866],{"class":294},[288,1365,1321],{"class":298},[288,1367,416],{"class":294},[288,1369,1370],{"class":334},"Page two",[288,1372,439],{"class":294},[288,1374,1321],{"class":298},[288,1376,321],{"class":294},[288,1378,1380,1382,1384],{"class":290,"line":1379},22,[288,1381,896],{"class":294},[288,1383,456],{"class":298},[288,1385,321],{"class":294},[288,1387,1389,1391,1393],{"class":290,"line":1388},23,[288,1390,626],{"class":294},[288,1392,509],{"class":298},[288,1394,321],{"class":294},[288,1396,1398,1400,1402],{"class":290,"line":1397},24,[288,1399,439],{"class":294},[288,1401,456],{"class":298},[288,1403,321],{"class":294},[242,1405,1406,1407,1410,1411,1410,1414,1417,1418,647],{},"See ",[250,1408,1409],{"href":214},"pagination",", ",[250,1412,1413],{"href":183},"headers",[250,1415,1416],{"href":187},"footers",", and ",[250,1419,1420],{"href":190},"Blob, ArrayBuffer and Base64 output",[267,1422,1424],{"id":1423},"when-to-use-this-package-instead-of-direct-html2pdfjs-or-jspdf","When to use this package instead of direct html2pdf.js or jsPDF",[242,1426,1427,1429,1430,1433,1434,1437],{},[245,1428,247],{}," packages Vue component and composable APIs around PDF generation. It provides a selectable-text renderer alongside Canvas capture, browser preview\u002Fdownload\u002Fprint, pagination helpers, headers, footers, watermarks, output serialization and Nuxt import guidance. Direct ",[245,1431,1432],{},"html2pdf.js"," or ",[245,1435,1436],{},"jsPDF"," use gives you lower-level control and may fit a small custom pipeline. Choose the package when its documented Vue integration and built-in workflows match your needs; choose direct libraries when you prefer to assemble those behaviors yourself. Verify CSS fidelity and PDF features against your own documents.",[1439,1440,1441],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":284,"searchDepth":324,"depth":324,"links":1443},[1444,1445,1446,1447],{"id":269,"depth":324,"text":270},{"id":650,"depth":324,"text":651},{"id":929,"depth":324,"text":930},{"id":1423,"depth":324,"text":1424},"Copy Vue 3 and Nuxt 3\u002F4 HTML-to-PDF examples for selectable text, pagination, headers, footers and Blob output with published vue-pdf-export 1.1.1.","md",null,{},{"title":1453,"description":1454},"Vue HTML to PDF with Selectable Text (1.1.1)","Three runnable Vue and Nuxt PDF export examples for selectable text, SSR-safe browser generation, page breaks, headers and Blob output.","han3kWqAjoOblZoGeiwJIXiXHNUZUAhmbL-rSftWFz0",[1457,1450],{"title":144,"path":230,"stem":231,"description":1458,"children":-1},"Understand vue-pdf-export large-document performance engineering, incremental Canvas rendering, memory reduction, cancellation, cleanup and regression testing.",1790687336873]