vue3.x版本
npm install tinymce -S
npm install @tinymce/tinymce-vue -S
再然后把node_modules/tinymce
下的skins
文件夾copy
到public
文件夾下
最后下載語言包,把里面的js文件也放進去
2.x版本
需要固定版本
npm install tinymce@5.1.0 -S
npm install @tinymce/tinymce-vue@3.0.1 -S
然后把上面說的文件copy到static文件夾下
修改edit的init配置,文件路徑要指向你剛才放置的路徑
init: {
language_url: '/tinymce/langs/zh_CN.js',
language: 'zh_CN',
skin_url: '/tinymce/skins/ui/oxide',
content_css: '/tinymce/skins/content/default/content.css',
}
桌面端富文本組件正常,移動端不顯示
F12,切換到移動模式顯示,發現是mobile/theme.js
中的<!DOCTYPE html>
報錯,原來是針對移動端有專門的js文件渲染,在/node_modules/tinymce/themes
下存在兩個目錄,分別是silver和mobile,在封裝組件的時候只引用了這個:
import 'tinymce/themes/silver'
加上如下引用:
import 'tinymce/themes/mobile'