how to convert component to pdf using jspdf and htm2canvas - reactjs

Question

i am trying to build cv maker web application.and i need to convert componet to pdf file.
here my code
const handelDownload = () => {
html2canvas(componentRef.current).then(function (canvas) {
const divImage = canvas.toDataURL("image/png");
const pdf = new jsPDF();
pdf.addImage(divImage, "PNG", 0, 0);
pdf.save("download.pdf");
});
};
return (
<>
<h1>hello world</h1>
<div ref={componentRef}>
<h1 className="text-4xl bg-red-500">My Component</h1>
<p className="text-lg">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vel
ipsum et velit posuere tempus sed ac ex. Vestibulum ante ipsum primis
in faucibus orci luctus et ultrices posuere cubilia curae; Integer
eget augue faucibus, placerat leo vitae, dignissim mi. Fusce id nibh
id risus congue consequat ac ut libero. Duis ut tincidunt turpis. Nam
scelerisque tortor in risus interdum consequat. Ut vel lectus sem.
Nulla hendrerit erat vel massa finibus, eget laoreet tellus ultrices.
Integer rhoncus lectus quis libero imperdiet, et viverra turpis
fermentum. Donec ullamcorper nisl eget felis dictum, at suscipit dolor
viverra. Etiam ullamcorper sem sit amet ante bibendum iaculis.
</p>
</div>
</>
problem is qulity of pdf is wrost and elements are not in the same position in the PDF as they are in the original component.
i also try reactpdf.