jsPDF错误 - 字体在vFS中不存在（VueJs）

Question

jsPDF错误 - 字体在vFS中不存在（VueJs）

5

我可能在我的代码中遇到了一个错误，但我还不确定。我正在尝试在我的Vue应用程序中创建一个带有自定义字体的PDF文件。我下载了该字体并使用在Github存储库中提供的/fontconverter/fontconverter.html将其转换为base64。我创建了一个名为“fonts”的新文件夹。在该文件夹中，我包含了自定义字体的.ttf文件和来自字体转换器的.js文件。接下来，我创建了一个名为downloadPdf()的方法，它看起来像这样：

const doc = new jsPDF()
doc.setFontSize(28);

doc.text(20, 30, 'This is the default font.')

doc.setFont('courier')
doc.setFontType('normal')
doc.text(20, 60, 'This is courier normal.')

//This does not seem to solve the problem. 
//Also, this method is already included at the bottem of the 'Roboto-Regular-normal.js' file
doc.addFileToVFS("./fonts/Roboto-Regular.ttf", './fonts/Roboto-Regular-normal.js');
doc.addFont("./fonts/Roboto-Regular.ttf", "Roboto", "normal");
doc.setFont("Roboto");
doc.text("Reinier van der Galien", 20, 90);

console.log(doc.getFontList());
doc.save("customFonts.pdf");

这将创建PDF，并使用自定义字体，所以可以正常工作。但是，在控制台中仍会出现以下错误： “jsPDF PubSub错误：没有字体的Unicode cmap错误：没有字体的Unicode cmap” 还有： “jsPDF PubSub错误：无法读取未定义属性'widths'” addFileToVFS方法似乎不起作用。需要帮助。

- Reinier68

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- mgabonay · Accepted Answer

这是我的解决方案，可能不是最理想的，但它能够工作。

首先，将带有字体的文件导入。该文件仅包含具有字体字符串的常量，并导出该常量。

import Roboto from '@/assets/fonts/Roboto-Regular-normal.js'
import RobotoBold from '@/assets/fonts/Roboto-Bold-bold.js'

然后将它添加到jsPDF文档中。

let doc = new jsPDF()
doc.addFileToVFS('Roboto-Regular.ttf', Roboto)
doc.addFileToVFS('Roboto-Bold.ttf', RobotoBold)
doc.addFont('Roboto-Regular.ttf', 'Roboto', 'normal')
doc.addFont('Roboto-Bold.ttf', 'Roboto', 'bold')
doc.setFont('Roboto')

编辑：我从字体转换器获取字体字符串。我只提取了导出文件中的该字符串，删除了其他所有内容。