如何让TinyMCE支持任意未知自定义组件，无需预先定义？

要让TinyMCE代码编辑器支持任意自定义元素（无需预先定义元素名），可以通过以下配置实现：

• 启用HTML5 schema：HTML5原生支持自定义元素，这是基础前提
• 使用通配符配置custom_elements：让编辑器接受所有元素，不用预先列出具体名称
• 配置valid_children：允许任意元素嵌套，满足类似<media-plus><img></media-plus>的嵌套场景

具体的初始化配置代码如下：

tinymce.init({
  selector: '#your-editor-id',
  schema: 'html5',
  custom_elements: '*',
  valid_children: '+*[*]',
  // 其他你需要的编辑器配置
});

配置说明 #

• schema: 'html5'：切换到HTML5解析模式，原生支持自定义元素的语法
• custom_elements: '*'：通配符表示接受所有元素，不管是<my-comp />这类自闭合元素，还是带嵌套的自定义标签都能被保留
• valid_children: '+*[*]'：允许任意元素作为任意元素的子节点，确保嵌套结构不会被编辑器过滤

配置完成后，你在代码编辑器中输入的任何自定义元素都会被完整保留，不需要提前知晓元素名称。

内容的提问来源于stack exchange，提问作者mdre