Ошибка jsPDF - Шрифт не существует в vFS (VueJs) - PullRequest
0 голосов
/ 18 октября 2019

Возможно, в моем коде есть ошибка, но я пока не уверен. Я пытаюсь создать PDF-файл в своем приложении Vue с помощью собственного шрифта. Я скачал шрифт и преобразовал его в base64 с помощью /fontconverter/fontconverter.html, предоставленного в репозитории github. Я создал новую папку под названием «шрифты». В папку я включил как .ttf-файл пользовательского шрифта, так и .js-файл из fontconverter. Затем я создал метод с именем 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, похоже, не работает. Любая помощь приветствуется.

1 Ответ

2 голосов
/ 18 октября 2019

Вот мое решение, возможно, не идеальное, но оно работает.

Первый импорт файлов со шрифтом. Файл содержит только константу со строкой шрифта и экспорт этой константы.

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 . Из экспортированного файла я взял только эту строку, все остальное я удалил.

...