Попытка использовать клиентскую библиотеку PDF pdfmake в моем проекте Angular 2 (версия = 4.2.x).
В файле .angular-cli.json я объявил js следующим образом:
"scripts": [
"../node_modules/pdfmake/build/pdfmake.js",
"../node_modules/pdfmake/build/vfs_fonts.js"
]
А затем в app.component.ts я использовал это так:
import * as pdfMake from 'pdfmake';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
pdf: any;
downloadPdf() {
let item = {firstName: 'Peter', lastName: 'Parker'};
this.pdf = pdfMake;
this.pdf.createPdf(buildPdf(item)).open();
}
}
function buildPdf(value) {
var pdfContent = value;
var docDefinition = {
content: [{
text: 'My name is: ' + pdfContent.firstName + ' ' + pdfContent.lastName + '.'
}]
}
console.log(pdfContent);
return docDefinition;
}
Я нажимаю ниже ошибку в консоли браузера при загрузке приложения:
Uncaught TypeError: fs.readFileSync is not a function
at Object.<anonymous> (linebreaker.js:15)
at Object.<anonymous> (linebreaker.js:161)
at Object.../../../../linebreak/src/linebreaker.js (linebreaker.js:161)
at __webpack_require__ (bootstrap b937441…:54)
at Object.../../../../pdfmake/src/textTools.js (textTools.js:4)
at __webpack_require__ (bootstrap b937441…:54)
at Object.../../../../pdfmake/src/docMeasure.js (docMeasure.js:4)
at __webpack_require__ (bootstrap b937441…:54)
at Object.../../../../pdfmake/src/layoutBuilder.js (layoutBuilder.js:7)
at __webpack_require__ (bootstrap b937441…:54)
Мой обходной путь для решения этой проблемы:
Скопируйте pdfmake.js и vfs_fonts.js в папку с ресурсами, а затем добавьте это в index.html:
<script src='assets/pdfmake.min.js'></script>
<script src='assets/vfs_fonts.js'></script>
Удалите это из app.component.ts
import * as pdfMake from 'pdfmake';
И добавьте это в app.component.ts:
declare var pdfMake: any;
Наконец, удалите это из .angular-cli.js:
"../node_modules/pdfmake/build/pdfmake.js",
"../node_modules/pdfmake/build/vfs_fonts.js"
Это работает, но это все еще обходной путь.
Кто-нибудь знает, как использовать эту библиотеку в Angular/Typscript?
Большое спасибо!
