最新的tinymce会提示”This domain is not registered with TinyMCE Cloud“,要求注册tinymce官方云才能下载所需组件类库。
既然这样,那么解决办法就简单了:要么去注册云,要么屏蔽掉提示~~,要么全部由本地加载。
如果只导入import Editor from '@tinymce/tinymce-vue',那么会从tinymce云上调用组件,此刻若没api-key的话,会提示需要注册。

点击提示中的注册链接【create an account】,去注册一个账号,就能获得一个 api-key

使用时将该值配置给 api-key 就行
<Editor :api-key="abcdefghijklmnopqrst1234567890" />
tinymce.min.js 中的提示部分这。。。
"service_message":"This domain is not registered with Tiny Cloud. Please review \u003ca target=\"_blank\" href=\"https://www.tiny.cloud/my-account\"\u003eyour approved domains\u003c/a\u003e."
加入import 'tinymce/tinymce'就启用了本地加载,但还差各种组件和样式的调用,下面以css为主体进行分析。
import 'tinymce/tinymce'
// Theme
import 'tinymce/themes/silver/theme'
// icons
import 'tinymce/icons/default'
// models
import 'tinymce/models/dom'
// Skins 下面将具体分析这三个css的调用
// import 'tinymce/skins/ui/oxide/skin.min.css'
// import 'tinymce/skins/ui/oxide/content.min.css'
// import 'tinymce/skins/content/default/content.min.css'
// Plugins 组件根据init中调用情况自行加载
import 'tinymce/plugins/fullscreen'
import 'tinymce/plugins/autoresize'
CSS调用解析:
有两种方法调用css:
一个是使用import,由系统调用;
一个是配置init中的skin、skin_url和content_css等参数,由tinymce调用,其中
skin默认值是oxide,
skin_url默认值是skins/ui/oxide,
content_css默认值是skins/content/default/content.css,可url,也可xyz,这样值为skins/content/xyz/content.css。
import和init中参数import调用,那么在打包时,tinymce所需的.css会缺失;init中的参数,那么tinymce就会到默认地址去调用;
import导入css
assets目录里有tinymce.css(注意文件名中有个随机数,这样开发时就无法提前配置打包后的css路径)。
skin_url参数的默认值去调用css,于是抛出404错误。
skin:false、skin_url:''、content_css:'',明确告知tinymce不需要读取skin,才能取消这些错误。content_css为空的话,编辑器内部的样式又怎么办呢?还好tinymce提供一个content_style参数,让开发者可以手写style。利用这个参数,我们就可以实现全部css用import调用啦。<template>
<div>
<Editor :init="init" />
</div>
</template>
<script setup>
import Editor from "@tinymce/tinymce-vue";
import 'tinymce/tinymce'
import 'tinymce/models/dom'
import 'tinymce/icons/default'
import 'tinymce/themes/silver/theme'
// Skins
import 'tinymce/skins/ui/oxide/skin.min.css'
import 'tinymce/skins/ui/oxide/content.min.css'
import content_style from 'tinymce/skins/content/dark/content.min.css' //将内容存入content_style
// Plugins 组件根据init中调用情况自行加载
import 'tinymce/plugins/fullscreen'
import 'tinymce/plugins/autoresize'
// 关闭skin,调用路径设置为空
const init = {
skin:false,
// skin_url: '', // 因为skin已经为false,所以此参数设不设都无所谓了
content_css: '',
content_style: content_style, //将导入的css内容送给content_style参数使用
}
</script>
import,在打包后是没有tinymce相关css文件的。
skin_url和content_url,并将tinymce\skins复制到public目录里,就能解决调用问题。
public目录中的内容直接复制到dist目录中供tinymce使用:
参考代码:
<template>
<div>
<Editor :init="init" />
</div>
</template>
<script setup>
import Editor from "@tinymce/tinymce-vue";
import 'tinymce/tinymce'
import 'tinymce/models/dom'
import 'tinymce/icons/default'
import 'tinymce/themes/silver/theme'
// Skins 在init的参数中配置
// import 'tinymce/skins/ui/oxide/skin.min.css'
// import 'tinymce/skins/ui/oxide/content.min.css'
// import 'tinymce/skins/content/default/content.min.css'
// Plugins 组件根据init中调用情况自行加载
import 'tinymce/plugins/fullscreen'
import 'tinymce/plugins/autoresize'
// 两个参数中提供public目录下的路径
const init = {
// skin:'oxide', // 默认值为oxide,和skin_url配合使用
skin_url: 'tinymce/skins/ui/oxide', // skin路径
content_css: 'tinymce/skins/content/dark/content.css', // 以css文件方式自定义可编辑区域的css样式,css文件需自己创建并引入
// 本案例中仅仅针对css分析,如果你想把theme、icons和model都用参数配置,而不是import,那么用下面的三个参数即可
// theme_url:'',
// icons_url:'',
// model_url:'',
}
</script>
- 在开发环境下
init参数中配置的css地址后,tinymce会直接从public目录调用,而不是node_modules目录。- 建议在
public目录里建个static、res等类似名称的二级目录,将各种css、js文件放在这个二级目录里,这样打包后就不会在dist目录中乱成一团了。import的文件会被打包,init中参数中设置的文件在开发环境会去public目录里调用,在生产环境会从根目录里调用。- 情况三中的大部分import都可以通过配置init中参数来实现调用:
theme_url、icons_url、model_url、language_url…- 本文真正领会后,实际开发时遇到类似调用的问题时就都可以解决了。
- tinymce配置太多了,包括plugin的使用得写好多import,如果形式比较固定的,建议再套个壳做个tm插件,这样每次使用都方便。
参考
This domain is not registered with TinyMCE Cloud
使用tinymce富文本编辑器部署到环境报错:/js/skins/ui/oxide/content.min.css net::ERR_ABORTED 404 (Not Found)
TinyMCE Skin options
Adding or changing the editor content CSS
Vue3集成富文本编辑器TinyMce6
Premium upgrade promotion
tinymce 去掉 ⚡️Upgrade 按钮
我正在编写一个包含C扩展的gem。通常当我写一个gem时,我会遵循TDD的过程,我会写一个失败的规范,然后处理代码直到它通过,等等......在“ext/mygem/mygem.c”中我的C扩展和在gemspec的“扩展”中配置的有效extconf.rb,如何运行我的规范并仍然加载我的C扩展?当我更改C代码时,我需要采取哪些步骤来重新编译代码?这可能是个愚蠢的问题,但是从我的gem的开发源代码树中输入“bundleinstall”不会构建任何native扩展。当我手动运行rubyext/mygem/extconf.rb时,我确实得到了一个Makefile(在整个项目的根目录中),然后当
我们的git存储库中目前有一个Gemfile。但是,有一个gem我只在我的环境中本地使用(我的团队不使用它)。为了使用它,我必须将它添加到我们的Gemfile中,但每次我checkout到我们的master/dev主分支时,由于与跟踪的gemfile冲突,我必须删除它。我想要的是类似Gemfile.local的东西,它将继承从Gemfile导入的gems,但也允许在那里导入新的gems以供使用只有我的机器。此文件将在.gitignore中被忽略。这可能吗? 最佳答案 设置BUNDLE_GEMFILE环境变量:BUNDLE_GEMFI
相信很多人在录制视频的时候都会遇到各种各样的问题,比如录制的视频没有声音。屏幕录制为什么没声音?今天小编就和大家分享一下如何录制音画同步视频的具体操作方法。如果你有录制的视频没有声音,你可以试试这个方法。 一、检查是否打开电脑系统声音相信很多小伙伴在录制视频后会发现录制的视频没有声音,屏幕录制为什么没声音?如果当时没有打开音频录制,则录制好的视频是没有声音的。因此,建议在录制前进行检查。屏幕上没有声音,很可能是因为你的电脑系统的声音被禁止了。您只需打开电脑系统的声音,即可录制音频和图画同步视频。操作方法:步骤1:点击电脑屏幕右下侧的“小喇叭”图案,在上方的选项中,选择“声音”。 步骤2:在“声
首先回顾一下拉格朗日定理的内容:函数f(x)是在闭区间[a,b]上连续、开区间(a,b)上可导的函数,那么至少存在一个,使得:通过这个表达式我们可以知道,f(x)是函数的主体,a和b可以看作是主体函数f(x)中所取的两个值。那么可以有, 也就意味着我们可以用来替换 这种替换可以用在求某些多项式差的极限中。方法: 外层函数f(x)是一致的,并且h(x)和g(x)是等价无穷小。此时,利用拉格朗日定理,将原式替换为 ,再进行求解,往往会省去复合函数求极限的很多麻烦。使用要注意:1.要先找到主体函数f(x),即外层函数必须相同。2.f(x)找到后,复合部分是等价无穷小。3.要满足作差的形式。如果是加
深度学习部署:Windows安装pycocotools报错解决方法1.pycocotools库的简介2.pycocotools安装的坑3.解决办法更多Ai资讯:公主号AiCharm本系列是作者在跑一些深度学习实例时,遇到的各种各样的问题及解决办法,希望能够帮助到大家。ERROR:Commanderroredoutwithexitstatus1:'D:\Anaconda3\python.exe'-u-c'importsys,setuptools,tokenize;sys.argv[0]='"'"'C:\\Users\\46653\\AppData\\Local\\Temp\\pip-instal
我想在IRB中浏览文件系统并让提示更改以反射(reflect)当前工作目录,但我不知道如何在每个命令后进行提示更新。最终,我想在日常工作中更多地使用IRB,让bash溜走。我在我的.irbrc中试过这个:require'fileutils'includeFileUtilsIRB.conf[:PROMPT][:CUSTOM]={:PROMPT_N=>"\e[1m:\e[m",:PROMPT_I=>"\e[1m#{pwd}>\e[m",:PROMPT_S=>"FOO",:PROMPT_C=>"\e[1m#{pwd}>\e[m",:RETURN=>""}IRB.conf[:PROMPT_MO
我的Rails站点使用了一个确实不是很好的gem。每次我需要做一些新的事情时,我最终不得不花费与向实际Rails项目添加代码一样多的时间来为gem添加功能。但我不介意,我将我的Gemfile设置为指向我的gem的GitHub分支(我尝试提交PR,但维护者似乎已经下台)。问题是我真的没有找到一种合理的方法来测试我添加到gem的新东西。在railsc中测试它会特别好,但我能想到的唯一方法是a)更改~/.rvm/gems/.../foo。rb,这看起来不对或者b)升级版本,推送到Github,然后运行bundleup,这除了耗时之外显然是一场灾难,因为我不确定我所做的promise是否正
原始问题Letd(n)bedefinedasthesumofproperdivisorsofn(numberslessthannwhichdivideevenlyinton).Ifd(a)=bandd(b)=a,whereab,thenaandbareanamicablepairandeachofaandbarecalledamicablenumbers.Forexample,theproperdivisorsof220are1,2,4,5,10,11,20,22,44,55and110;therefored(220)=284.Theproperdivisorsof284are1,2,
我希望访问我机器上的所有HTTP流量(我的Windows机器-不是服务器)。据我了解,拥有一个本地代理是所有流量路线的必经之路。我一直在谷歌搜索但未能找到任何资源(关于Ruby)来帮助我。非常感谢任何提示或链接。 最佳答案 WEBrick中有一个HTTP代理(Rubystdlib的一部分)和here's一个实现示例。如果你喜欢生活在边缘,还有em-proxy伊利亚·格里戈里克。这postIlya暗示它似乎确实需要一些调整来解决您的问题。 关于ruby-如何捕获所有HTTP流量(本地代理)
我正在尝试找出一种方法来显示来自不在RAILS_ROOT下(在RedHat或Ubuntu环境中)的已安装文件系统的图像。我不想使用符号链接(symboliclink),因为这个应用程序实际上是通过Tomcat部署的,而当我关闭Tomcat时,Tomcat会尝试跟随符号链接(symboliclink)并删除挂载中的所有图像。由于这些文件的数量和大小,将图像放在public/images下也不是一种选择。我查看了send_file,但它只会显示一张图片。我需要在一个格式良好的页面中显示6个请求的图像。由于膨胀,我宁愿不使用Base64编码,但我不知道如何将图像数据与呈现的页面一起传递下去。