给后台管理系统添加描述功能,决定使用流行的TinyMCE富文本编辑器作为辅助插件。
按照网上的配置操作了一下测试的时候发现不能完整的显示编辑器,只有上传图片一个按钮:
在这里插入图片描述
打开F12查看报错信息如下:

Uncaught SyntaxError: Unexpected token '<'
......
[Vue warn]: Error in mounted hook: "TypeError: Cannot read property 'init' of undefined"
found in
---> <Tinymce> at src\components\Tinymce\index.vue
       <ElFormItem>
         <ElForm>
           <Info> at src\views\edu\course\info.vue
             <AppMain> at src\views\layout\components\AppMain.vue
               <Layout> at src\views\layout\Layout.vue
                 <App> at src\App.vue
                   <Root>

TypeError: Cannot read property 'init' of undefined
    at VueComponent.initTinymce (index.vue?50bd:101)
    at VueComponent.mounted (index.vue?50bd:84)
    at callHook (vue.runtime.esm.js:2917)
    at Object.insert (vue.runtime.esm.js:4154)
    at invokeInsertHook (vue.runtime.esm.js:5956)
    at VueComponent.patch [as __patch__] (vue.runtime.esm.js:6175)
    at VueComponent.Vue._update (vue.runtime.esm.js:2666)
    at VueComponent.updateComponent (vue.runtime.esm.js:2784)
    at Watcher.get (vue.runtime.esm.js:3138)
    at Watcher.run (vue.runtime.esm.js:3215)

这就很无语了,毕竟自己刚刚接触这一款插件,在网上找了很多资料也没有解决=,=
于是就抱着试一试的心态又走了一遍自己配置的文件
结果运气不错,在index.html中注意到了一件奇怪的事情:
在这里插入图片描述
引入的插件脚本竟然不知道资源url指向哪里!!!
回到webpack.dev.conf.js中查看定义的BASE_URL:
在这里插入图片描述
以及他实际的指向:
在这里插入图片描述
自己也的的确确定义了啊=,=
抱着试一试的态度把index.html中的BASE_URL改成了他所指向的路径:
在这里插入图片描述
再测试一下,竟然运行成功了!!!
在这里插入图片描述

问题虽然是解决了,但我还是有点不理解错的原因是啥。。。
为啥他就找不到我指定的url呢?
莫非是我用了<%= %>而导致的格式不规范?
如果有哪位大佬知晓的话还敬请告诉愚钝的小生啦(๑>ڡ<)☆

Logo

前往低代码交流专区

更多推荐