博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Vue-cli实现Markdown解析为Html以及highlight高亮代码块
阅读量:6224 次
发布时间:2019-06-21

本文共 501 字,大约阅读时间需要 1 分钟。

hot3.png

marked用来干什么的?

  • 一个功能齐全的markdown解析器编译器,用JavaScript编写。速度建成。

marked该怎么使用?

  • 安装
npm install -g marked       //全局安装
  • 使用

这里marked作为解析器解析为浏览器能够支持的网页之后,就可以和正常访问浏览器一样啦。然后这里有没有一个小插曲呢,项目经理说,咦,那代码块里面的样式都是清一色的,我可以不可以让它花里胡哨起来呢?当然没有问题啦,这里我们就介绍下一个主角登场。噔噔噔~~~,那就是我们的Highlight.js

  • Highlight是一款能够输出html高亮代码的软件。支持159种程序语言,具体请看: 内置多种高亮主题,总有一款样式是你喜欢的。
  • 如果以上样式还有不满足个人项目需求的,可以自己动手新建一个css文件,写入和自己胃口的样式。

用完之后具体的结果是怎么样的?

  • 做完这些之后,页面差不多就是下面这个样子

输入图片说明

输入图片说明

分享仅作参考,如果又不对的可以多多指出来,谢谢。

转载于:https://my.oschina.net/u/3041966/blog/1606167

你可能感兴趣的文章
《Node.js设计模式》基于ES2015+的回调控制流
查看>>
Apple 如何知道你使用了私有API
查看>>
在PyODPS DataFrame自定义函数中使用pandas、scipy和scikit-learn
查看>>
Ant Design 中 对话框Modal 作为详情弹框展示 右下角只需一个按钮
查看>>
CocoaPods 安装与使用
查看>>
Vue双向绑定原理,教你一步一步实现双向绑定
查看>>
iOS 恢复现场
查看>>
聊聊spring cloud gateway的RemoveHopByHopHeadersFilter
查看>>
六、TextInput
查看>>
Nginx 的ngx_http_core_module模块
查看>>
Java+Ajax实现用户名重复检验
查看>>
Runtime运行时之Class常用方法
查看>>
Python元编程:控制你想控制的一切
查看>>
利用Charles抓取数据详细流程
查看>>
如何使用 vue + typescript 编写页面 ( vuex装饰器部分 )
查看>>
JAVA设计模式之责任链模式
查看>>
JVM分析工具概述
查看>>
HTML5前端初级入门教程:AJAX及常用的两种跨域方法
查看>>
《Java编程思想》笔记08------持有对象
查看>>
Android面试之Java中级篇
查看>>