maven-editor作为一个优秀的基于vue的markdown编辑器。适用于博客类网站。
今天在开发中发现样式失效了,出现了如下问题
- 左侧的输入框正常输入,但是右侧的显示框没有显示出正确的样式。
- 单显示mavon-editor的显示框,显示样式依然失效
如果你也有样式失效的情况出现,那么恭喜你可以解决了兄弟。
主要是因为mavon-editor源码中对于样式的获取是在线的,应该是第一次获取是在线的,这就导致我在内网环境直接copy过去样式不显示。坑啊
首先我们找到maven-editor
模块的组件maven-editor.vue
我们会发现它获取的资源是直接写的url,这就会导致如果你的项目像我一样,如果在内网部署的话,它需要的脚本和样式会获取不到。
解决办法:
找到源码下的dist文件夹
node_modules/mavon-editor/dist
将源码中dist文件夹下所有文件复制一遍,在自己的项目public文件夹下增加mavon-editor文件夹,然后再一起放进去,如下
接下来在使用<mavon-editor>的标签下增加属性:externalLink="externalLink"并在data中指定自己复制下来的文件中脚本和样式的对应路径
代码如下:
<mavon-editor
ref=