解决vue-element-admin 组件Markdown 预览窗口太小问题

最新推荐文章于 2025-10-05 07:18:24 发布

原创

最新推荐文章于 2025-10-05 07:18:24 发布 · 1.6k 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #前端 #javascript

本文档介绍了在使用vue-element-admin时遇到Markdown编辑器样式问题的解决方案。问题源于vue-element-admin从simplemde-markdown-editor切换到tui.editor，后者在后续版本中更名为@toast-ui/editor。修复方法包括修改package.json文件或通过命令行操作，重新安装依赖。同时提供了MarkdownEditor组件的代码示例，展示了如何适配新编辑器。完成修改后，运行npm run dev即可。

问题展示

最近在使用 vue-element-admin ，然后当在使用Markdown 编辑器的时候发现了Markdown 输出样式有问题，如图：

在这里插入图片描述

修复后的效果

问题解释

大致意思是vue-element-admin master 分支使用的markdown 编辑器是基于tui.editor 这个库。

Markdown is based on tui.editor ，simply wrapped with Vue. Documentation

Originally used simplemde-markdown-editor as the markdown editor, but this library has not been updated and maintained for a long time, and there is also the risk of xss. So after the v3.9.3+ version, use tui.editor as the new editor. All the next documents are Based on tui.editor it. More Content.