springboot整合editor.md编辑器内容编辑

springboot整合editor.md

---

前言

由于我的项目需要进行富文本编辑，于是我使用springboot整合editor.md编辑器

一、下载editor.md

开源在线 Markdown 编辑器
进入下载官网

采用第一种Github下载，点击即可下载压缩包

解压可得到以下文件

示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。

二、将editor添加到springboot项目

在resource目录下新建一个editormd目录用于存放editor的资源文件(就是刚刚我们解压的文件)


新建一个html文件，导入css、js、jquery

引入CSS

 <link rel="stylesheet" type="text/css" href="../../editormd/css/editormd.min.css" />
 <link rel="stylesheet" href="../../editormd/css/style.css" />
 <link rel="stylesheet" href="../../editormd/css/editormd.css"/>

引入JS

<script src="../../editormd/editormd.min.js"></script>
<script src="../../editormd/editormd.js"></script>

引入jquery
在BootCDN中引入

复制链接

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="../../editormd/editormd.min.js"></script>
<script src="../../editormd/editormd.js"></script>

最重要的部分：

<script type="text/javascript">
    $(function() {
        var editor = editormd("test-editor", {
            width  : "100%",
            height : "100%",
            path   : "../../editormd/lib/"
        });
    });
</script>

三、效果图：