lpreterite / vue-tinymce-example Goto Github PK

View Code? Open in Web Editor NEW

95.0 2.0 137.0 3.13 MB

在vue中使用tinymce的例子 📖

License: MIT License

JavaScript 90.49% HTML 0.03% Vue 0.30% CSS 9.19%

vue-tinymce-example's Introduction

vue-tinymce-example

在vue中使用tinymce的例子 📖

🎙 介绍

这个例子提供给各位想在项目中使用tinymce的伙计。

例子主要分为两个大类：

按需引用（use import）：使用import的方式引用tinymce项目，最终经过webpack打包至项目内部。
全局挂载（use in global）：使用tinymce优秀的插件懒加载功能，tinymce将会以外挂的方式应用至项目。

两种方式任君选择，如何选可以继续阅读下面详情，不想看可以直接下载项目跑起来看看再做选择。

按需引用

按需引用能帮你彻底隐藏tinymce，它将被完整地打包至项目。自然其缺点就是打包后文件巨大的体积将会成为一个问题。

主题和插件请仔细引用，因为少了漏了功能就会缺失。

选择你的项目：

vue-cli
vite

全局挂载

全局挂载的方式可以说是非常便利，一次设置无需管理。当然，后续你将要面对tinymce代码外露和全局作用等风险。

这种方式只推荐内部系统使用，防不了小人提防君子还是要的。

选择你的项目：

vue-cli
vite

💡 学习资料

遇到问题建议先看下面网站提供的资料：

不行再加群咨询：

对tinymce的vue封装想深入了解的，可以看我制作的组件源码🔬：

@packy-tang/vue-tinymce

vue-tinymce-example's People

Contributors

Stargazers

Watchers

Forkers

nyhxiaoning thinksail smalleast woniu3821 newdsa greatflag bunajianke zhangpj10 chcoc001 1963331542 curlychen98 lxcok1981 xiaolingfeng yingjunxiaobaibai peng-tai rabbit-liu gaofangyuan kaigg00 renlonghui shijinw lvhang-zz niunai2016 upmin-l 403236979 1445356667 flickercode falefalefa yokochen222 yezei zss1004504439 zj-dreamly ftllove fishedman kaitochen bf3dying lujunjian1570 junkyzhu sj1406576460 94xxh a5595303 mineagle wanggongz zhaoao950120 smalllulu daisy-xl bigfish-alex shuaishuai222 eadio kangmy getchange yallivon cliock 361513999 feiyangzz smartsmallfish lemontree345 ellabu nyanekoplus smartdriver001 cners anglen-aurora wcsanshu eddiewhz fishyhl plugin-d berryite zfchengjun rrrrain font-size xsqy xq5273508 changshuiwu 1104049235 lilac-dream skyqaq grayxk tao-lionel wangqing6 1114796814 weijunhu ji8czi wangpeishihang xiaowangplusa past-code wuwenhao0619 hongweiqiu 4165306 zzwlff wangkaixuan lovemylove xieyiduo gitshoyu houwhu g-wangzh hgjia02 bytangyue godbandfox jiang-zheng cathy-wei hzwjs

vue-tinymce-example's Issues

vue例子中的全局引入缺少步骤，提示没有vue-tinymce组件

如题

按照文档的形式全局引入之后，只有首次加载页面成功加载了，刷新页面就会报资源错误unexpected token '<' (from tinymce.min.js:1)

如题

我把富文本插入到一个elementui的对话框内，如果对话框我选择打开的话，还会报错 unexpected token '<' from theme.min.js

实在不知道是什么影响的

npm或者yarn安装组件时报错

报错如下：‘error An unexpected error occurred: "https://registry.npm./@packy-tang%2fvue-tinymce: getaddrinfo ENOTFOUND registry.npm.".
请问有人遇到过同样的问题吗？

vue项目中通过按需引入的方式不生效

在vue项目中，通过按需引入的方式，发现content.min.css没有成功引入进来，按照文档引入的，不知道怎么回事

设置content_style和content_css都无法生效

setting: {
content_style: "p {margin: 10px; border: 5px solid red; padding: 3px}",
height: 800,
language: 'zh_CN',
plugins: "code image axupimgs preview",
toolbar: "code axupimgs preview",
branding: false,
images_upload_handler: function (blobInfo, succFun, failFun) {
var file = blobInfo.blob(); //转化为易于理解的file对象
var formdata = new FormData();
formdata.append('files', file)
axios.post(${process.env.VUE_APP_BASE_API}/system/oss/uploadListByEditor, formdata, {
headers: {
'Content-Type': 'multipart/form-data'
},
}).then(result => {
console.log(result)
if (result.data.code == 200) {
succFun(result.data.data[0])
} else {
failFun(result.data.code)
}
})
}
}