Developer docs and how to customize PDF options with JSON Resume CLI and custom themes

[alicescfernandes]

Hi!
This is not an issue per se, but the docs also don't mention how to develop themes. While trying to debug some rendering issues on puppeteer, i came across a way to customize rendering. By default, resume-cli will render a PDF with in letter format. In Europe we use A4 paper. Also, resume-cli doesn't respect @ media print rules. This can be changed by setting mediaType: 'print' on the pdfRenderOptions

In order to customize the rendering options, you need to export a pdfRenderOptions on the index.js of the theme. I believe that this only works for local themes though

Example code

module.exports = {
	render: render,
	pdfRenderOptions: {
		format: 'A4',
		mediaType: 'print',
		pdfViewport: { width: 1920, height: 1280 },
		margin: {
			top: '0.4in',
			bottom: '0.4in',
			left: '0.4in',
			right: '0.4in',
		},
	},
};

The PDF options that puppeteer accepts on page.pdf are also accepted by the resume-cli. You can check available PDF options here

Is there anyway that we can develop some sort of documentation for theme developers? I would be willing to work on that

[asbjornu]

I was just hit by this void of information and thankfully found this issue giving me a bit more information and context. More elaborate documentation in the PDF + custom theme area would be highly appreciated for sure!

[XuluWarrior]

I've been trying to make my theme more print friendly and came across this issue.
Having played with it a bit my observations are

• This still doesn't seem to be officially documented anywhere. Which is shame
• In the Developer docs and how to customize PDF options with JSON Resume CLI and custom themes #617 (comment) pdfViewport is in the wrong place.
  Looking at the code, resume-cli expects it to be at the root level of the exports and it uses it to setViewPort on the page e.g.

module.exports = {
  render: render,
  pdfViewPort: { ... },
  pdfOptions: { ... }
}

• pdfViewPort/setViewPort doesn't actual have the expected effect. https://stackoverflow.com/questions/59951399/puppeteer-viewport-settings-having-no-effect-when-creating-pdf
• To actually change the width/height I had to set them directly in pdfOptions and clear format (which is defaulted in resume-cli to letter) as this overrides width/height
  e.g.

module.exports = {
  ...
  pdfOptions: {
    width: "1200px",
    height: "1692px", // A4 ratio
    format: undefined
 }
}