如何使用 pdfMake 中文字体
如何使用 pdfMake 中文字体?
致敬永远最棒的 stack overflow:https://stackoverflow.com/questions/60047023/how-to-import-custom-fonts-for-pdfmake-in-angular-application
首先你需要安装下面的套件:
npm install -g pdfmake-font-generator
用上面这个库转化字体。
命令如同:
pdfmakefg assets/fonts assets/custom-fonts.js
记住前面是一个文件夹。
我想你肯定没有字体,那么你就去 windows 里面爬,但是那些字体都太大了,可以去[这里][1]看看。
然后打开这个文件,把第一行修改成下面的样子:
this.pdfMake = this.pdfMake || {}; this.pdfMake.vfs = {"hei.// 转为下面的样子import pdfMake from "pdfmake/build/pdfmake";
pdfMake.vfs = {"hei.
其实就是修改 vfs 的字体数据。不过默认转化后的文件使用 umd,现代化 es 模块你需要改一下。
然后在你的文件中,去掉默认的 pdfmake vfs 字体,使用你自己的:
// import pdfFonts from 'pdfmake/build/vfs_fonts';import pdfFonts from "./../assets/custom-fonts";
接着配置 pdfMake 字体:
pdfMake.fonts = {Arial: {normal: "ARIAL.TTF", // 保持你字体文件名,包括后缀bold: "ARIALBD.TTF",italics: "ARIALI.TTF",bolditalics: "ARIALBI.TTF",},
};
最后在你的文档定义中设置默认使用的字体:
const documentDefinition = {content: "",defaultStyle: {font: "Arial",},
};
pdfMake.createPdf(documentDefinition).open();
好的,不出意外你的字体就生效了。
参考
- [小字体库][1]
[1]:https://github.com/RichStrong/tiny_font#