use markdown-it to replace marked

Author: TitanSnow

package.json

@@ -15,14 +15,14 @@
     "analyze": "cross-env NODE_ENV=development BUNDLE_ANALYZE=true webpack --progress --hide-modules"
   },
   "dependencies": {
+    "@iktakahiro/markdown-it-katex": "^3.0.3",
     "babel-runtime": "^6.26.0",
-    "escape-html": "^1.0.3",
     "font-awesome": "^4.7.0",
-    "highlight.js": "^9.12.0",
-    "katex": "^0.9.0-alpha2",
+    "highlight.js": "^9.9.0",
+    "katex": "^0.9.0",
     "lodash": "^4.17.4",
-    "marked": "^0.3.12",
-    "md5": "^2.2.1",
+    "markdown-it": "^8.4.1",
+    "markdown-it-highlightjs": "^3.0.0",
     "vue": "^2.5.11",
     "vue-codemirror-lite": "^1.0.3"
   },

src/components/ContentParserFactory.js

@@ -1,33 +1,8 @@
 import { MarkdownParser } from './plugin/MarkdownParser'
-import md5 from 'md5'
 
 function contentParserFactory (parsers) {
     return content => {
-        let newContent = content
-        const stringMap = []
-
-        parsers.forEach(function (parserConfig) {
-            let matches = newContent.match(parserConfig.reg)
-
-            while (matches !== null) {
-                const mapItem = {
-                    hash: md5(matches[0]),
-                    segment: matches[0],
-                    content: parserConfig.parser(matches)
-                }
-                newContent = newContent.replace(mapItem.segment, mapItem.hash)
-                stringMap.push(mapItem)
-
-                matches = newContent.match(parserConfig.reg)
-            }
-        })
-
-        newContent = MarkdownParser(newContent, stringMap)
-
-        stringMap.forEach(function (mapItem) {
-            newContent = newContent.replace(mapItem.hash, mapItem.content)
-        })
-        return newContent
+        return MarkdownParser(content, parsers)
     }
 }
 

src/components/DefaultConfig.js

@@ -1,4 +1,7 @@
-import KatexParser from './plugin/KatexParser'
+import KatexParser from '@iktakahiro/markdown-it-katex'
+import 'katex/dist/katex.css'
+import HighlightjsParser from 'markdown-it-highlightjs'
+import 'highlight.js/styles/tomorrow.css'
 import { defaultBtns, getBtns } from './toolbar-button/toolbarBtn'
 import _ from 'lodash'
 
@@ -16,7 +19,8 @@ export const defaultConfig = {
     previewDisplay: 'normal',
     fullScreen: false,
     parsers: [
-        KatexParser
+        KatexParser,
+        HighlightjsParser
     ],
     toolbarConfig: defaultBtns,
     editorOption: {

src/components/plugin/Highlight.js

@@ -1,59 +1,9 @@
-import 'highlight.js/styles/tomorrow.css'
-import 'katex/dist/katex.css'
-import Highlight from './Highlight'
-import escapeHtml from 'escape-html'
-import katex from 'katex/dist/katex'
+import MarkdownIt from 'markdown-it'
 
-export function MarkdownParser (code, stringMap) {
-    const marked = require('marked')
-
-    const renderer = new marked.Renderer()
-
-    renderer.heading = function (text, level) {
-        return '<h' + level + '>' + text + '</h' + level + '>'
-    }
-
-    const highlight = function (code) {
-        return Highlight.highlightAuto(code).value
-    }
-
-    renderer.code = function (code, lang) {
-        stringMap.forEach(function (mapItem) {
-            code = code.replace(mapItem.hash, mapItem.segment)
-        })
-
-        if (lang === 'latex') {
-            try {
-                return katex.renderToString(code, {
-                    displayMode: true
-                })
-            } catch (exception) {
-                return code
-            }
-        }
-
-        const out = highlight(code, lang)
-        if (out !== null) {
-            code = out
-        }
-
-        if (!lang) {
-            return '<pre><code class="mp-code ">' +
-                code +
-                '\n</code></pre>'
-        }
-
-        return '<pre><code class="mp-code ' +
-            'lang-' +
-            escapeHtml(lang) +
-            '">' +
-            code +
-            '\n</code></pre>\n'
-    }
-
-    marked.setOptions({
-        renderer: renderer,
-        sanitize: true
+export function MarkdownParser (code, parsers) {
+    var converter = MarkdownIt()
+    parsers.forEach(parser => {
+        converter = converter.use(parser)
     })
-    return marked(code)
+    return converter.render(code)
 }

src/components/plugin/KatexParser.js

@@ -93,6 +93,12 @@
     lodash "^4.17.5"
     to-fast-properties "^2.0.0"
 
+"@iktakahiro/markdown-it-katex@^3.0.3":
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/@iktakahiro/markdown-it-katex/-/markdown-it-katex-3.0.3.tgz#910287d8365c99ea857c9c45877bd97304296607"
+  dependencies:
+    katex "^0.9.0"
+
 abbrev@1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
@@ -1159,10 +1165,6 @@ chardet@^0.4.0:
   version "0.4.2"
   resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.4.2.tgz#b5473b33dc97c424e5d98dc87d55d4d8a29c8bf2"
 
-charenc@~0.0.1:
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/charenc/-/charenc-0.0.2.tgz#c0a1d2f3a7092e03774bfa83f14c0fc5790a8667"
-
 check-types@^7.3.0:
   version "7.4.0"
   resolved "https://registry.yarnpkg.com/check-types/-/check-types-7.4.0.tgz#0378ec1b9616ec71f774931a3c6516fad8c152f4"
@@ -1485,10 +1487,6 @@ cross-spawn@^6.0.5:
     shebang-command "^1.2.0"
     which "^1.2.9"
 
-crypt@~0.0.1:
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/crypt/-/crypt-0.0.2.tgz#88d7ff7ec0dfb86f713dc87bbb42d044d3e6c41b"
-
 crypto-browserify@^3.11.0:
   version "3.12.0"
   resolved "https://registry.yarnpkg.com/crypto-browserify/-/crypto-browserify-3.12.0.tgz#396cf9f3137f03e4b8e532c58f698254e00f80ec"
@@ -1928,7 +1926,7 @@ es6-weak-map@^2.0.1:
     es6-iterator "^2.0.1"
     es6-symbol "^3.1.1"
 
-escape-html@^1.0.3, escape-html@~1.0.3:
+escape-html@~1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/escape-html/-/escape-html-1.0.3.tgz#0258eae4d3d0c0974de1c169188ef0051d1d1988"
 
@@ -2611,7 +2609,7 @@ he@^1.1.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd"
 
-highlight.js@^9.12.0:
+highlight.js@^9.9.0:
   version "9.12.0"
   resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-9.12.0.tgz#e6d9dbe57cbefe60751f02af336195870c90c01e"
 
@@ -2860,7 +2858,7 @@ is-binary-path@^1.0.0:
   dependencies:
     binary-extensions "^1.0.0"
 
-is-buffer@^1.1.5, is-buffer@~1.1.1:
+is-buffer@^1.1.5:
   version "1.1.6"
   resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-1.1.6.tgz#efaa2ea9daa0d7ab2ea13a97b2b8ad51fefbe8be"
 
@@ -3138,7 +3136,7 @@ json5@^0.5.0, json5@^0.5.1:
   version "0.5.1"
   resolved "https://registry.yarnpkg.com/json5/-/json5-0.5.1.tgz#1eade7acc012034ad84e2396767ead9fa5495821"
 
-katex@^0.9.0-alpha2:
+katex@^0.9.0:
   version "0.9.0"
   resolved "https://registry.yarnpkg.com/katex/-/katex-0.9.0.tgz#26a7d082c21d53725422d2d71da9b2d8455fbd4a"
   dependencies:
@@ -3185,6 +3183,12 @@ levn@^0.3.0, levn@~0.3.0:
     prelude-ls "~1.1.2"
     type-check "~0.3.2"
 
+linkify-it@^2.0.0:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/linkify-it/-/linkify-it-2.0.3.tgz#d94a4648f9b1c179d64fa97291268bdb6ce9434f"
+  dependencies:
+    uc.micro "^1.0.1"
+
 load-json-file@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-1.1.0.tgz#956905708d58b4bab4c2261b04f59f31c99374c0"
@@ -3237,6 +3241,10 @@ lodash.debounce@^4.0.8:
   version "4.0.8"
   resolved "https://registry.yarnpkg.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af"
 
+lodash.flow@^3.1.0:
+  version "3.5.0"
+  resolved "https://registry.yarnpkg.com/lodash.flow/-/lodash.flow-3.5.0.tgz#87bf40292b8cf83e4e8ce1a3ae4209e20071675a"
+
 lodash.memoize@^4.1.2:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
@@ -3297,9 +3305,22 @@ map-visit@^1.0.0:
   dependencies:
     object-visit "^1.0.0"
 
-marked@^0.3.12:
-  version "0.3.19"
-  resolved "https://registry.yarnpkg.com/marked/-/marked-0.3.19.tgz#5d47f709c4c9fc3c216b6d46127280f40b39d790"
+markdown-it-highlightjs@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/markdown-it-highlightjs/-/markdown-it-highlightjs-3.0.0.tgz#ed3dd619ca2b98e6bf2112d163bf444043340210"
+  dependencies:
+    highlight.js "^9.9.0"
+    lodash.flow "^3.1.0"
+
+markdown-it@^8.4.1:
+  version "8.4.1"
+  resolved "https://registry.yarnpkg.com/markdown-it/-/markdown-it-8.4.1.tgz#206fe59b0e4e1b78a7c73250af9b34a4ad0aaf44"
+  dependencies:
+    argparse "^1.0.7"
+    entities "~1.1.1"
+    linkify-it "^2.0.0"
+    mdurl "^1.0.1"
+    uc.micro "^1.0.5"
 
 match-at@^0.1.1:
   version "0.1.1"
@@ -3320,13 +3341,9 @@ md5.js@^1.3.4:
     hash-base "^3.0.0"
     inherits "^2.0.1"
 
-md5@^2.2.1:
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/md5/-/md5-2.2.1.tgz#53ab38d5fe3c8891ba465329ea23fac0540126f9"
-  dependencies:
-    charenc "~0.0.1"
-    crypt "~0.0.1"
-    is-buffer "~1.1.1"
+mdurl@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/mdurl/-/mdurl-1.0.1.tgz#fe85b2ec75a59037f2adfec100fd6c601761152e"
 
 media-typer@0.3.0:
   version "0.3.0"
@@ -5159,6 +5176,10 @@ typedarray@^0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
 
+uc.micro@^1.0.1, uc.micro@^1.0.5:
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/uc.micro/-/uc.micro-1.0.5.tgz#0c65f15f815aa08b560a61ce8b4db7ffc3f45376"
+
 uglify-js@^2.8.29:
   version "2.8.29"
   resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-2.8.29.tgz#29c5733148057bb4e1f75df35b7a9cb72e6a59dd"