为什么 html2pdf.js 包会出现 left-margin 和 overlap 问题？

Question

我尝试用 html2pdf 制作 pdf 文件。它在某些时候工作得很好，但我有两个主要问题。

首先，当我选择渲染的元素大于窗口视图高度（当我可以滚动网站时），然后在渲染的 pdf 文档中左侧出现某种空白，并且由于也就是说，整个 pdf 内容都滑到了一边，所以右边被切断了。

第二个问题是分页属性。使用断页属性的问题是，新断页的一小部分在前一页上，并且在每次断页之后，这一小部分会越来越大。

左侧空白的第一个问题也出现在 Chrome 和 Edge 中，但在 Firefox 中工作得很好。

这是来自 html2pdf 的代码：

const opt = {
        margin: [0,0,0,0], //top, left, bottom, right
        filename: 'myfile.pdf',
        image: {type: 'jpeg', quality: 0.98},
        html2canvas: {
            scale: 2,
            scrollX: 0,
            scrollY: 0,
            y: 0,
            dpi: 400,
            // letterRendering: true,
            // windowWidth:500,
        },
        jsPDF: {
            unit: 'pt',
            format: 'a4',
            orientation: 'portrait',
            // compress: true,
            // marginLeft: 20,
            // marginRight: 20,
            // marginTop: 0,
            // floatPrecision: 'smart'
        },
        pagebreak: {mode: 'css', before: '.break-before', avoid: '.no-break'},
        // noPdfOpenParams: true
    };

const pdf = html2pdf().set(opt).from(page).toPdf().get('pdf').then(function (pdf) {
     window.open(pdf.output('bloburl'), '_blank');
})

html 文件只是一些常规的 div 元素，具有更多嵌套的 html 元素和一张图像。我有像这样的主要 div 元素

<div id="page" style="width: 595pt; padding: 0 20px;background-color: burlywood">

，在那个 div 元素中我有带有类名 break-before 的子 div 元素，对于图像所在的 div，我有一个类名 no-break.

这是当

page

元素大于窗口视图高度时的样子：

这里是分页问题（在第三分页处）：

Answer 1

我找出右边空白的原因是什么。问题是 0.10.1 版本，如果有人遇到同样的问题，请尝试使用 0.9.3 版本，对我来说，它解决了问题。

<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.9.3/html2pdf.bundle.min.js"
        integrity="sha512-YcsIPGdhPK4P/uRW6/sruonlYj+Q7UHWeKfTAkBW+g83NKM+jMJFJ4iAPfSnVp7BKD4dKMHmVSvICUbE/V1sSw=="
        crossorigin="anonymous" referrerpolicy="no-referrer"></script>

第二个问题取决于尺度属性。如果我将它设置为 1，那么工作正常，遗憾的是质量不是最好的，使用比例 2 会很好，这是一个更好的质量。