ngular5中将html导出为pdf
1.安装pdfmake:
npm install pdfmake --save
2.在ts文件中导入:
import * as pdfMake from 'pdfmake/build/pdfmake';
import * as pdfFonts from 'pdfmake/build/vfs_fonts';
3.测试pdfmake:
pdfMake.vfs = pdfFonts.pdfMake.vfs;
var dd = { content:{text:"HelloWorld!",alignment: 'center',};
pdfMake.createPdf(dd).download();
4.处理中文问题:
a.找到需要的字体文件(后缀.ttf);
b.将pdfmake的源代码克隆或下载到本地,(https://github.com/bpampuch/pdfmake);
c.进入pdfmake根目录,安装gulp,使用命令为
npm install gulp --save-dev;
d.安装pdfmake所需要的依赖包,使用命令:
npm install;
e.将自己所需要的字体放在pdfmake目录下的examples/fonts的目录中;
f.然后在执行:
gulp buildFonts ;
g.f步骤完成后会在build 文件夹中找到vfs_fonts.js
h.用pdfmake项目中的vfs_fonts.js替换原来项目中的vfs_fonts.js
5.使用字体:(以“微软雅黑”为例)
pdfMake.fonts = {
微软雅黑: {
normal: '微软雅黑.ttf',
bold: '微软雅黑.ttf',
italics: '微软雅黑.ttf',
bolditalics: '微软雅黑.ttf',
}
};
var dd = { content:{text:"HelloWorld!",alignment: 'center',font: '微软雅黑'};
pdfMake.createPdf(dd).download();
6.其他操作可以参考官网
https://juejin.im/
标签:pdfMake,微软,vfs,fonts,angular4,html,pdf,pdfmake,雅黑
来源: https://www.cnblogs.com/ahu666/p/12850887.html