vue项目中集成tinymce富文本编辑器

富文本编辑器插件：tinymce
版本：5.4
中文翻译网站: http://tinymce.ax-z.cn/
官网：https://www.tiny.cloud/docs/

背景：后台通过生成的编辑器内的HTML生成PDF

遇到的坑：

1. 不支持同时粘贴多张图片（支持单张粘贴）
2. 图片上传不支持多张图片同时上传
3. 不支持文本与图片同时粘贴 （只会保留img宽高，无src属性）
4. 粘贴格式问题：
   1. 如果要支持带格式粘贴的话， 通过后台生成PDF，你的格式比如字体，服务器上是没有的，字体无法展示，有一些样式是css样式表即class，在前端展示是没有问题的，但是后台生成PDF应该是获取不到这个class，样式表引入的也可能是有问题的，最好使用行内样式。
   2. 表格粘贴展示的宽度问题，可以代码进行调整。我这里是粘贴时设置表格宽度为100%。
5. 如果后台要生成PDF，而编辑器引入了一张外网图片，后台服务器会遇到如何获取外网图片的问题，获取不到的话后台生成的PDF里这张外网图片就是空白。我这里是不支持粘贴、引入外网图片。
6. tinymce的粘贴插件paste不支持粘贴上传，但是可以配置允许粘贴base64的图片。考虑到图片可能会比较大，我做的时候就统一上传到了服务器。用官网推荐的powerpaste插件替换了paste，powerpaste是支持粘贴图片上传服务器的，而且从Word/excel粘贴到编辑器时可以配置粘贴时是否保留格式。个人建议清除原有格式，保留格式的话可能会有一些预想不到的坑，只保留原有结构就可以了（如果要通过后台生成PDF的话）。
7. 关于powerpaste：使用这个插件的话不支持import引入和npm安装，需要将tinymce整个插件配置到public文件夹下，并将powerpaste文件配置到tinymce文件夹下的plugins文件夹下。整个tinymce插件就需要通过script标签进行引入了。官网上的powerpaste是需要付费的，这里也是从无所不能的百度找了个下载。需要的话可以留言。（当然了，如有问题概不负责）。

附一张效果图：

刚才发现优快云也有富文本编辑器，试了一下，貌似也不支持上述提到的123功能，哈哈哈哈，优快云官方有解决方案之后请同步一下哦，手动@优快云

后续更新集成配置。

目前想到的就这些了，欢迎各路大佬批评指正。

【注】：如有侵权，联系删除