2

Hi i want to generate a pdf of big page as one single file without page break.

Below image shows page break upon download(that i want to avoid, want to download as single page).

enter image description here

Question: i don't want to split the page upon download as multiple page. but want a single page.

here is what my working example look like codesandbox demo

Note: any pdf generating plugin is fine for me, if it works.

Please help me thanks in advance !

EaBengaluru
  • 131
  • 2
  • 17
  • 59
  • How will a page fit on a single one if it's too tall? – kissu May 26 '22 at 12:37
  • @kissu, if solution is pagination then the solution is most welcomed. – EaBengaluru May 26 '22 at 12:49
  • You just don't want to have a page breaking your content? Probably a matter of how much your screen is tall. A lot of libraries would be able to handle that IMO. – kissu May 26 '22 at 12:55
  • @kissu, actually i was looking for something like this https://youmescript.com/ try adding line it will get you next page. seems difficult for me so i'm trying to download full page. by the way they seems to be using `PDFMake` http://pdfmake.org/#/ – EaBengaluru May 26 '22 at 13:39

4 Answers4

3

Your current styles do not make it easy to set the page media there are just too many conflicts in A4 layout so you need to reconsider the output as A3 or A2 as seen here 4A4 printed without any code box controls, or scale down your output to fit on the A4 page you have set.

The code requirement is either pre-set page size before to include all content OR use a Browse save as PDF that does that for you, and the one I know will do the Job well is Chromium based Opera Portable Browser but the page will be, just like roll plotters, a "Non standard" ratio.

enter image description here enter image description here

K J
  • 8,045
  • 3
  • 14
  • 36
  • your method seems to be correct, but i need **coding solution** !! – EaBengaluru May 30 '22 at 04:13
  • .. @K J , please give me example here by forking https://codesandbox.io/s/xenodochial-ptolemy-y2vetx?file=/src/components/A4.vue i'm really confused. don't know how to incoporate those changes. please. – EaBengaluru May 30 '22 at 12:29
0

Have you considered an API rest service? Restpack HTML to PDF has a free trial. Worth a shot to see if you can get the correct formatting. The API call's JSON body allows you to specify the px length and width you want. This should avoid pages breaks if you size it correctly. You can read their documentation here

Anthony Schanen
  • 98
  • 5
-1

You can use the CSS properties break-before, break-inside and break-after. In your concrete example, adding this CSS rule avoids all the flex containers splits:

.flex-container {
   break-inside: avoid;
}

Please note that there are some limitations to these rules, and some browsers might produce different results too.

Eduardo Páez Rubio
  • 1,032
  • 2
  • 9
  • 31
-1

The PDF standard

The PDF file format standard was built on a page descriptor language named postscript and created for documents with defined page sizes.

This means that a valid PDF file does not support unpaginated content.

See the PDF Wikipedia article for more info.

So what?

It may be achieved in some unsupported manner, but circumventing the standards will usually result in unpredictable behavior across different viewers.

You may be able to generate one big non-standard page size, but that could also be a potential problem in some PDF viewers.

Still want to try?

It's up to you, go ahead, but what ever you do, make sure you test your output files well.

Preferably with several of the most popular PDF reader/viewer applications before distributing them.

Unless you want to publish files that may turn out to be useless to your intended recipients.

svin83
  • 239
  • 1
  • 4
  • 13
  • I wouldn't agree since the latest iOS/iPad Safari browser allows creating a "screenshot" of an entire web page as a single-page PDF without page breaks, I have doubts Apple made this against the PDF standard. – Oleksandr Mar 30 '23 at 07:42
  • @Oleksandr You wouldn't agree? Look up the standards! They are publicly available information. There's nothing to doubt. – svin83 Mar 31 '23 at 01:49
  • @Oleksandr I'm not an Apple user so I can't verify your claims. If the PDF standards haven't changed since I answered the question, and what you say is true, then Apple is either breaking the standard and creating unsupported PDF files, or they adjust the page length to fit the entire web page instead of using standardized page sizes. – svin83 Mar 31 '23 at 01:53
  • @KJ You're saying it wasn't developed to use standardized paper? If you do, then you need to read up. It was made to be portable while still achieving print-outs looking almost identical to what is on screen. That was the purpose behind the PDF format. **I never said fixed or immutable sizes**. I only said you can't have a valid PDF without **defined pages**. One single non-standard very long page is still a page. It may pose some challenges if you ever wish to print it though. – svin83 Mar 31 '23 at 18:27