此项目仅能用于vue3项目中,核心功能为解析markdown文本
|
|
há 1 ano atrás | |
|---|---|---|
| src | há 1 ano atrás | |
| .gitignore | há 1 ano atrás | |
| README.md | há 1 ano atrás | |
| index.js | há 1 ano atrás | |
| package-lock.json | há 1 ano atrás | |
| package.json | há 1 ano atrás |
此项目仅能用于vue3项目中,核心功能为解析markdown文本。
如果主项目是react项目,可直接使用react-markdown进行markdown的解析和展示。
如果主项目是vue项目,则可以考虑使用此方法进行markdown的解析和展示。
此项目参考dify中使用的react-markdown,并进行相应的改写,使得dify的markdown解析方案能用于vue3项目中。
dify中的markdown解析方法较为复杂,并不是单纯的将markdown源字符串进行解析然后展示,而是经过了解析、抽象语法树的构建、react组件的生成等一系列工作,最终在界面上呈现出markdown的解析结果。所以和直接解析markdown源字符串并展示的方案相比,可能存在一些细节上的差异。
$ npm install --save git+http://gitlab.smartai.com/zhupei/dify-markdown-parse.git
import difyMarkdownParse from 'dify-markdown-parse'
const markdown = `
# hello world
* 苹果
* 香蕉
`
const result = difyMarkdownParse(markdown);
console.log(result); // 请查看下方输出结果
输出结果
<h1>hello world</h1>
<ul>
<li>苹果</li>
<li>香蕉</li>
</ul>