web项目集成markdown

下载markdown源码

首先，下载markdown的源码
源码放在了github中，源码地址：https://github.com/Edenwds/component（引用自参考《在web项目中使用MarkDown组件》）

将editormd目录下代码放入项目

down了源码 component-master.zip后，在 component-master -> MarkDown -> WebRoot下，有一个editormd文件夹
将整个文件夹放进自己的web项目里（放jsp的那块）如果觉得整个editormd太大了，是可以精简一下的
可以先将基础的构建起来后，再看看哪些必须，哪些不需要

editormd下的样例

editormd目录下的examples文件夹下有很多html文件，可以点开来看看，如果不想每个都点，直接点simple.html打开看也行

simple.html直接点击访问后，如下图，是一个很基本的markdown

在notepad++中打开simple.html，研究一下代码（没有notepad++用别的文本查看器也完全没问题呀，比如UE啦，或者直接电脑里自带的文本查看器。用notepad++有格式颜色，看着比较舒服）


可以看一下editormd目录下的editormd.js，有缩进看着比较舒服，就是里面的注释都是英文的（是时候考验英文水平了）

遇到的问题

记录一下遇到的问题和解决

问题一：页面上要使用到多个jQuery，冲突了咋办？

因为页面上要用到editormd里的jquery，和我页面要使用的jquery冲突，所以我把editormd的jquery放到的头部，给了个别名

在jsp底部，使用头部给出的别名

参考：
《解决一个html 或jsp 引入多个不同版本的jquery 解决方案》
https://my.oschina.net/111222233/blog/1559755

问题二：怎么我按着simple.html敲了代码，markdown咋没显示呀？

这个path要注意一下，我反正改了就好了

问题三：我不想要那么多工具，就想要几个，可不可以呀？

查看editormd.js可以看到，toolbar的modes，有三种：full（最全的），simple（少了部分功能），mini（最少的）

如下图，是展示simple模式的工具

那我要是连mini都觉得太多呢，或者三种模式都不能满足我的按钮显示需要呢？
如下图就好啦。

参考：
《Markdown 编辑器Editor.md集成使用》
https://www.jianshu.com/p/a1f37bcbdf9f

问题四：我的页面不是只有markdown一个文本框，拖动页面的时候，工具栏变得很奇怪，咋整？

toolbarAutoFixed:false 关闭掉工具栏的始终置顶
拖动页面总算是正常了

参考：
《使用editor编辑器遇到的小问题：editor.md工具栏置顶》
https://blog.csdn.net/azax4/article/details/101931212

问题五：我的工具栏按钮鼠标放上去显示的乱码，这可咋整？

我反正用的比较笨的方法，按照editormd.js，将lang复制了拿过来了，乱码解决了

问题六：我后台存了markdown格式的文本，我前台只想展示预览页面，并且预览页面的小叉叉不要了，免得用户可以点击，咋整？

研究了example夹的例子，还有editormd.js后，我琢磨琢磨整了个这。别说，还挺好使

以上就是我的一些心得。啊，真的是，还好还有各路前人大神。搜不到的问题，就只有靠自己摸索了。与诸君共勉。

总参考：
《在web项目中使用MarkDown组件》
https://blog.csdn.net/sinat_36553913/article/details/78339733