jsPDF - импорт шрифтов в стиле React. js / ES6 - PullRequest
Новая
       11

jsPDF - импорт шрифтов в стиле React. js / ES6

0 голосов
/ 28 января 2020

Я пытаюсь добавить шрифт в jsPDF в моем проекте React. Я преобразовал шрифт в base64 и в скрипт .js, используя предоставленный генератор по адресу: https://rawgit.com/MrRio/jsPDF/master/fontconverter/fontconverter.html

Я импортирую скрипт шрифта как: 

import '../../assets/fonts/js/Muli-normal';

где Muli-normal - преобразованный файл Muli-normal.js из Muli.ttf с использованием генератора. Я установил шрифт с помощью 

doc.setFont('Muli')

, но получаю ошибку 

  Line 10:5:  'jsPDF' is not defined  no-undef

Сценарий выглядит следующим образом: 

// ../../assets/fonts/js/Muli-normal.js

(function (jsPDFAPI) {
var font = 'AAEAAAASAQAABAAgRkZUTW2ZUGwAAAE..
...
...
...ASAQAAB';
var callAddFont = function () {
this.addFileToVFS('Muli-normal.ttf', font);
this.addFont('Muli-normal.ttf', 'Muli', 'normal');
};
jsPDFAPI.events.push(['addFonts', callAddFont])
})(jsPDF.API);

1 Ответ

0 голосов
/ 28 января 2020

Поскольку скрипт не распознает jsPDF, необходимо импортировать его, используя 

import jsPDF from 'jspdf'

, поэтому скрипт становится: 

// Muli-normal.js

import jsPDF from 'jspdf'

(function (jsPDFAPI) {
var font = 'AAEAAAASAQAABAAgRkZUTW2ZUGwAAAE..
...
...
...ASAQAAB';
var callAddFont = function () {
this.addFileToVFS('Muli-normal.ttf', font);
this.addFont('Muli-normal.ttf', 'Muli', 'normal');
};
jsPDFAPI.events.push(['addFonts', callAddFont])
})(jsPDF.API);

Я до сих пор не могу точно понять, как скрипт Muli-normal.js структурирован. (модуль IIFE?). Я решил работать и ответить на мой вопрос, но любые объяснения по этому поводу приветствуются.

Надеюсь, это кому-то поможет

...