Laravel Voyager中Tinymce添加template插件加载失败404问题求助
问题根因
报错404是因为TinyMCE未在指定路径找到template插件文件,核心问题有两个:一是插件存放路径和加载路径不匹配,二是你当前配置中的外部插件加载段处于注释状态,并未实际生效。
解决步骤
- 选择合适的插件存放路径,二选一即可:
- 匹配Voyager默认加载路径:将和你当前TinyMCE版本一致的template插件文件夹,放到
public/vendor/tcg/voyager/assets/js/plugins/目录下,确保最终文件路径为public/vendor/tcg/voyager/assets/js/plugins/template/plugin.js,不需要额外配置外部插件。 - 自定义外部加载路径:在public目录下新建
tinymce/plugins文件夹,将template插件放入该目录,确保路径为public/tinymce/plugins/template/plugin.js。
- 匹配Voyager默认加载路径:将和你当前TinyMCE版本一致的template插件文件夹,放到
- 修改初始化配置
如果你选择自定义路径,需要取消external_plugins段的注释,不需要重复配置已有的默认插件,仅保留template相关配置即可,同时在toolbar中添加template按钮方便调用,修改后参考配置如下:
function tinymce_init_callback(editor) { console.log('Init!'); editor.remove(); editor = null; tinymce.init({ menubar: false, selector: 'textarea.richTextBox', skin_url: $('meta[name="assets-path"]').attr('content')+'?path=js/skins/voyager', min_height: 600, resize: 'vertical', plugins: 'link, image, code, table, textcolor, lists, template', extended_valid_elements : 'input[id|name|value|type|class|style|required|placeholder|autocomplete|onclick]', file_browser_callback: function(field_name, url, type, win) { if(type =='image'){ $('#upload_file').trigger('click'); } }, toolbar: 'styleselect bold italic underline | forecolor backcolor | alignleft aligncenter alignright | bullist numlist outdent indent | link image table | code | template', convert_urls: false, image_caption: true, image_title: true, external_plugins: { 'template': '/tinymce/plugins/template/plugin.js', } }); }
- 清理缓存验证生效
执行Laravel缓存清理命令php artisan config:clear,同时在浏览器按Ctrl+F5强制刷新静态资源,避免旧缓存导致配置不生效。
注意事项
必须保证下载的template插件版本和Voyager内置的TinyMCE版本完全一致,否则即使加载成功也可能出现功能异常。
内容的提问来源于stack exchange,提问作者user2770348
相关产品推荐
相关产品推荐

