jsPDF 错误 - vFS (VueJs) 中不存在字体

Question

我的代码中可能有错误，但我还不确定。我正在尝试使用自定义字体在我的 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 方法似乎不起作用。感谢任何帮助。

Answer 1

这是我的解决方案，可能并不理想，但它确实有效。

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

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')

编辑：我从 fontconvertor 获取字体字符串。从导出的文件中，我只取了那个字符串，我删除了所有其他内容。

jsPDF 错误 - vFS (VueJs) 中不存在字体

jsPDF Error - Font does not exist in vFS (VueJs)

jspdf