想要自己实现markdown编辑器,欲使用markdown-it作为编辑器,有着比较多的插件,可以实现代码高亮以及对数学公式转换等功能。

// Activate/deactivate rules, with curring
var md = require('markdown-it')()
.disable([ 'link', 'image' ])
.enable([ 'link' ])
.enable('image'); // Enable everything
md = require('markdown-it')({
html: true,
linkify: true,
typographer: true,
});

插件加载方式

var md = require('markdown-it')()
.use(plugin1)
.use(plugin2, opts, ...)
.use(plugin3);

代码高亮

var hljs = require('highlight.js'); // https://highlightjs.org/

// Actual default values
var md = require('markdown-it')({
highlight: function (str, lang) {
if (lang && hljs.getLanguage(lang)) {
try {
return hljs.highlight(lang, str).value;
} catch (__) {}
} return ''; // use external default escaping
}
});

Tex数学公式markdown-it-mathjax

var md = require('markdown-it')()
.use(require('markdown-it-mathjax')()); md.render('$1 *2* 3$') // => '<p>\(1 *2* 3\)</p>'

markdown转换为html的更多相关文章

  1. Pandoc将markdown转换为word

    markdown转换为word的指令 直接将markdown转换为word pandoc -f markdown -t docx ./test.md -o test.docx 关于markdown转为 ...

  2. 如何将markdown转换为wxml

    话说我要为技术博客写一个小程序版,我的博客解决方案是 hexo + github-page,格式当然是技术控们喜欢的 markdown 了 .但小程序使用的却是独有的模版语言 WXML.我总不能把之前 ...

  3. windows使用Pandoc将Markdown转换为PDF文件

    pandoc下载:https://github.com/jgm/pandoc/releases/tag/1.19.2.1 //windows下载msi文件 miktex下载:https://mikte ...

  4. sublime text 下的Markdown写作

    sublime text 2(3)下的Markdown写作 什么是 Markdown wiki Markdown 是一种方便记忆.书写的纯文本标记语言,用户可以使用这些标记符号以最小的输入代价生成极富 ...

  5. 【转】sublime text 2 下的Markdown写作

    sublime text 2 下的Markdown写作   作为Windows/Mac/Linux下强大的文本编辑器,st提供了对Markdown语言的支持.通过设置可实现markdown预览和转换功 ...

  6. 将markdown格式转化为bootstrap风格html

    前言:这些年markdown格式的文件很流行,像github里project说明文档都是用markdown格式编写. 一方面,我们能够通过pandoc将markdown文件转换为html,这样将htm ...

  7. Markdown文件导出为HTML的小程序

    Markdown文件导出为HTML的小程序 为什么做 最近把一些学习经验记下来,总结成MarkDown文件,不知不觉已经有12篇了. Sublime Text 的 MarkDown Preview 插 ...

  8. 【转】我们为什么要使用 Markdown

    目录 从前码字时我们面临着什么困境 标记语言显神威 到底什么是 Markdown 所以为什么我们要使用 Markdown Markdown 简明语法 段落和换行 标题 区块引用 列表 强调 代码标识和 ...

  9. Element 文档中的 Markdown 解析

    Element 的文档站是讲Markdown解析成vue组件在页面中渲染出来,转换过程如下图所示: 红框部分势必要对 Markdown 进行特殊的订制,订制过的 Markdown 像下面这样. ::: ...

随机推荐

  1. SpringBoot实战:我们的第一款开源软件

    原文出处: 纯洁的微笑 在信息爆炸时代,如何避免持续性信息过剩,使自己变得专注而不是被纷繁的信息所累?每天会看到各种各样的新闻,各种新潮的技术层出不穷,如何筛选出自己所关心的? 各位看官会想,我们是来 ...

  2. 通过ORM模型看python对象创建过程

    简易django ORM模型如下所示: #!/usr/bin/env python # encoding: utf-8 """ @version: 1.0 @author ...

  3. 11 Facts about Data Science that you must know

    11 Facts about Data Science that you must know Statistics, Machine Learning, Data Science, or Analyt ...

  4. python学习笔记4-内置函数、匿名函数、json处理

    print(all([1,2,3,4]))#判断可迭代的对象里面的值是否都为真 print(any([0,1,2,3,4]))#判断可迭代的对象里面的值是否有一个为真 print(bin(10))#十 ...

  5. Angular5基本入门

    基本环境安装 首先,确定安装了nodejs与npm,angular 5要求node版本在6.9.x以上.npm版本在 3.x.x以上: 1.安装@angular/cli npm install -g ...

  6. 出了一个js的题。

    class test { set xx(v){ console.log('i am set'); this.__ok = v; } get xx(){ console.log('i am get'); ...

  7. react页面间传递参数

    react-router页面跳转,带请求参数 this.context.router.push({pathname:'/car_datail',state:{item:"hello" ...

  8. Python练习-os模块练习-还算是那么回事儿

    # 编辑者:闫龙 # 小程序:根据用户输入选择可以完成以下功能: # 创建文件,如果路径不存在,创建文件夹后再创建文件 # 能够查看当前路径 # 在当前目录及其所有子目录下查找文件名包含指定字符串的文 ...

  9. Memcached与KVDB的区别

    Memcached将数据存储在内存中,数据易丢失,不适合对数据进行长期存储. KVDB则是将数据存储在磁盘中,数据安全性级别高,不易丢失.

  10. js_模块化

    https://www.cnblogs.com/scq000/p/10647128.html