wkhtmltopdf踩坑记录

需求是文字纵向排列，内容从左到右，本来用的是writing-mode: tb-rl;，插件转pdf后发现失效。 解决方法： 让每一列文字单独用一个div容器包裹，对它的宽度进行限制，控制每一行只能出现一个文字，然后用定位布局【因为wkhtmltopdf不支持flex布局】。 对于特殊字符，例如： 、 。等标点符号，需要在其前或后加上br标签控制换行，否则会出现每行有一个字但是后面会跟着特殊符号的情况。 而且对于像括号、书名号这些符号，由于我们只是用了点技巧迫使它纵向排列，而不是书写顺序真的是从上到下，因此这些符号还是会横向显示。效果如下图： 而我们希望这些特殊符号也是遵循纵向的书写顺序的，因此我们需要用到transform属性的rotate来做一些2d的角度旋转效果。

场景描述：我一开始用的命令行是直接将本地的html转pdf，然后就报了访问不到的错误，转出的pdf是没有本地html引入的图片的

报错：Warning: Blocked access to file 这是由 0.12.6 版本中默认行为的更改引起的。wkhtmltopdf现在默认禁用本地文件访问。可以通过添加命令行参数来解决

解决方法1： 加上配置参数，允许本地文件加载其他的本地文件

解决方法2：在本地运行一下文件，然后用url的方式去转pdf。 在vscode上打开要转pdf的html，然后右键选择open with live server。然后再输入指定的url。这种方式就可以，我也不知道为什么。

看了配置参数可以设置page-zise或者page-width/page-height，我没有尝试，只是把整个container的大小设置成A4大小，a4转成px是794px*1123px，因此要设置成对应的大小。然后设计图的尺寸也要修改成对应的固定宽度794px，因为设计图上的所有元素的属性都会随尺寸变化而变化【px是像素大小，是相对长度单位，具体要看分辨率】

要引入字体文件。@font-face指定字体规则和它的url。

第一次使用wkhtmltopdf踩了很多坑，它不支持很多css属性，然后对Html的书写规则也要求严格。如果有读者知道更好的开源html转pdf的插件，请麻烦告诉我。