vue解析markdown文件,无数尝试

01markdown是什么

markdown

Markdown是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。

Markdown语言在由约翰·格鲁伯(英语:JohnGruber)创建。

Markdown编写的文档可以导出HTML、Word、图像、PDF、Epub等多种格式的文档。

Markdown编写的文档后缀为.md,.markdown。

02Markdown应用

Markdown能被使用来撰写电子书,如:Gitbook。

当前许多网站都广泛使用Markdown来撰写帮助文档或是用于论坛上发表消息。例如:GitHub、简书、reddit、Diaspora、StackExchange、OpenStreetMap、SourceForge等。

03编辑器

本教程将使用Typora编辑器来讲解Markdown的语法,Typora支持MacOS、Windows、Linux平台,且包含多种主题,编辑后直接渲染出效果。

支持导出HTML、PDF、Word、图片等多种类型文件。

04vue解析工具

mavon-editor是一款基于vue的markdown编辑器,比较适合博客系统。

本节介绍的是另外一个工具marked。

marked是一个JavaScript编写的全功能Markdown解析和编译器。

marked的目的是快速的编译超大块的Markdown文本而不必担心结果会出乎意料或者花费很长时间。

marked最初是为Node.JS编写,现在已完全兼容客户端浏览器。

新版本号称速度比C语言写的Markdown转换工具Discount还要快。

05vue解析markdown文件

反正尝试了好久终于把这种办法试验出来了。

结果展示:

这样就可以在vue中解析markdown文档并展示了。

06提示

上面cdn的方法引入markdown的方式解析的格式还是可以的,但是呢,等我通过npm安装的时候,解析的格式就有问题:

npminstallmarked--save

在使用的页面:

importmarkedfrommarked;

调用了marked框架中的marked函数实现Markdown2HTML的解析:

document.getElementById(content).innerHTML=marked(

xml


转载请注明:http://www.aierlanlan.com/rzfs/4878.html

  • 上一篇文章:
  •   
  • 下一篇文章: 没有了