Jeecgboot tinyMCE富文本集成kityformula-editor数学公式插件

一、下载插件包

下载 kityformula-editor到本地后解压。

二、集成插件

（1）vue3项目public目录下依次新建文件夹：static->tinymce->plugins，将解压后的文件夹拷贝到plugins目录下，如下图所示。

（2）引入插件

在components/Tinymce/src/Editor.vue文件增加扩展插件配置：

components/Tinymce/src/tinymce.ts文件在plugins、toolbar增加kityformula-editor的配置：

三、修改插件页面路径 

这里很重要，如果没做修改会访问不到插件页面。

(1) 由于部署后访问要带上发布路径，插件加载它的html时也要带上发布路径。所以我们需要把发布路径传递到插件中。

main.ts中配置window全局变量给插件使用，这里的全局变量是项目的发布路径：

项目index.html入口文件配置如下： 

（2）修改插件plugins.js和plugins.min.js

1、获取发布路径，追加到页面路径。

确保浏览器能直接访问kityFormula.html，否则插件页面也是加载不出来的。 

2、修改判断条件

双击数字公式图片的时候能在插件页面回显公式：

 （四）效果