javascript - Puppeteer HTML to PDF 不应用外部 css 文件

Question

我在 node.js 中使用 Puppeteer 将 html 字符串转换为 pdf 文件。 head 中的样式有效，但那些从具有绝对路径的本地 .css 文件链接的样式无效。这是代码:

createPDF: async (html, file) => {
     const browser = await puppeteer.launch({
          headless: true
     })
     const page = await browser.newPage()
     await page.setContent(html, {
          waitUntil: 'domcontentloaded'
     })
     await page.pdf({
          format: 'A4',
          path: file,
          printBackground: true
     })
     await browser.close()
}

html 的head 看起来像这样:

<link href="C:\dev\project\src\views\tailwind.min.css" rel="stylesheet">
<style>
     .maindiv{
          padding-top:15pt;
     }
</style>

我也尝试使用 url 代替，但没有任何改变。

Answer 1

我不确定您是否已经解决了上述问题。在将 JS 文件包含到 HTML 模板中时，我遇到了同样的问题。我通过在 page.setContent() 之前添加 await page.addScriptTag({path: './ej2.min.js'}) 解决了这个问题。无需将脚本标记添加到 HTML 页面。要包含样式文件，可以使用 addStyleTag('file-name-goes-here') 方法。对于文件路径，请使用基础项目目录中的相对路径。