乐趣区

simplemde-编辑器在-bootstrap-4-下失效的问题

自己项目中有使用到 simplemde 这款 markdown 编辑器,前端使用的是 bootstrap 4 框架来搭建的。但是在实际使用 simplemde 的时候却发现样式 & 功能有点异常,主要有如下几个异常:

  • 光标不显示,即使配置了 autofocus: true
  • 文本框开头存在一行 xxxxxx 字样,这部分是代码里面原本不存在的,可以确定是 simplemde 后面加进去的

这里是截图,只有当鼠标再次点击,输入框获取焦点输入内容时,xxxx 这部分内容才会显示出来

通过 Google 搜索到了 GitHub 对应的一个 issue, 里面提到了一个解决方法,就是用
import {} from ‘simplemde/dist/simplemde.min.css’ 代替 import {} from ‘simplemde/src/css/simplemde.css’; 具体到自己的 case 就是直接用 https://cdn.jsdelivr.net/simp… 这里压缩版本的 CSS ( 下载到本地) 而不是通过 sass 文件编译过来的。具体的原因作者也没有直接指明,算是一个 hack。

记录在这里,希望能对那些遇到同样问题的人有所帮助~


广告时间:

有课学是一站式课程返现 & 推荐平台,支持极客时间、慕课网、segmentFault、网易云课堂、udacity 等等主流平台。有课学,学好课,有所获!

退出移动版