Estoy tratando de imprimir un PDF desde un marcado HTML usando el paquete html-pdf y, por alguna razón, el CSS no se aplica al documento final.
Estoy tratando de usar un archivo CSS local y uso la ruta absoluta para él, pero parece que no aparece.
Así es como configuro la ruta css absoluta en config.ts:
export const config: any = { development: { css: { defaultDocumentStyle: "file:///home/user/work/printing/src/styles/defaultStyling.css", }, templates: { defaultDocHeader: "file:///home/user/work/printing/src/templates/defaultDocHeader.html", defaultDocFooter: "file:///home/user/work/printing/src/templates/defaultDocFooter.html", }, }, }Y así es como construyo el marcado final que estoy tratando de imprimir:
const cssFile = config.css.defaultDocumentStyle const finalBody = ` <html> <head> <link rel="stylesheet" href="${cssFile}" type="text/css"> </head> <body>${joinedBodyContents}</body> </html> ` donde joinedBodyContents es el marcado del cuerpo principal.
Luego trato de imprimirlo así:
const options = { format: "A4", timeout: 30000, type: "pdf", orientation: "portrait", border: { right: "1in", left: "1in", }, header: { height: "20mm", contents: header, }, footer: { height: "20mm", contents: footer, }, } pdf.create(finalBody, options).toFile("out/finalPDF.pdf", function (err: Error, res: any) { if (err) return console.log(err) console.log(res) })Sin embargo, el estilo no se muestra en el PDF final. Si abro el archivo HTML que también genero y que también contiene el cuerpo final, muestra el estilo CSS, por lo que la ruta al archivo CSS parece ser correcta. ¿Alguna idea de por qué esto no funciona en el PDF final?
usa esto tal vez funcione
<html> <body> <style> h2[c]{ color:red; } </style> <h2 c>The window.print() Method</h2> <p>Click the button to print the current page.</p> <button onclick="window.print()">Print this page</button> </body> </html>