mirror of
https://github.com/marktext/marktext.git
synced 2025-05-03 01:40:13 +08:00

* feat: basic use of code block by prism * opti: remove codemirror from muya * feat: add highlight to math and frontmatter * feat: import and export in math block, html block, frontmatter, code block * update: paragraph ctrl * feat: copy and paste in new math block and html block * feat: update code block style in dark theme * feat: search and replace in code block * fix: update menu item status when selection changed * opti: optimization of updateCtrl divide it into clickCtrl and inputCtrl * opti: search and replace in code block when no lang selected * opti: copy paste in code block * feat: insert paragraph before or after code block * opti: change emoji.js to emoji.json * feat: auto indent in code block * opti: auto indent in code block * opti: remove the use of snabbdom-virtualize * fix: do not show format float box in code block * opti: emoji picker * update: delete some unused codes * update: electron * use a temp prismjs2 instead of prismjs
91 lines
2.0 KiB
JavaScript
91 lines
2.0 KiB
JavaScript
import marked from '../parser/marked'
|
|
import Prism from 'prismjs2'
|
|
import katex from 'katex'
|
|
import githubMarkdownCss from 'github-markdown-css/github-markdown.css'
|
|
import highlightCss from 'prismjs2/themes/prism.css'
|
|
import katexCss from 'katex/dist/katex.css'
|
|
import { EXPORT_DOMPURIFY_CONFIG } from '../config'
|
|
import { sanitize } from '../utils'
|
|
import { validEmoji } from '../ui/emojis'
|
|
|
|
export const getSanitizeHtml = markdown => {
|
|
const html = marked(markdown)
|
|
return sanitize(html, EXPORT_DOMPURIFY_CONFIG)
|
|
}
|
|
|
|
class ExportHtml {
|
|
constructor (markdown) {
|
|
this.markdown = markdown
|
|
}
|
|
// render pure html by marked
|
|
renderHtml () {
|
|
return marked(this.markdown, {
|
|
highlight (code, lang) {
|
|
return Prism.highlight(code, Prism.languages[lang], lang)
|
|
},
|
|
emojiRenderer (emoji) {
|
|
const validate = validEmoji(emoji)
|
|
if (validate) {
|
|
return validate.emoji
|
|
} else {
|
|
return `:${emoji}:`
|
|
}
|
|
},
|
|
mathRenderer (math, displayMode) {
|
|
return katex.renderToString(math, {
|
|
displayMode
|
|
})
|
|
}
|
|
})
|
|
}
|
|
// get html with style
|
|
generate (filename = '') {
|
|
const html = this.renderHtml()
|
|
return `<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>${filename}</title>
|
|
<style>
|
|
${githubMarkdownCss}
|
|
</style>
|
|
<style>
|
|
${highlightCss}
|
|
</style>
|
|
<style>
|
|
${katexCss}
|
|
</style>
|
|
<style>
|
|
.markdown-body {
|
|
box-sizing: border-box;
|
|
min-width: 200px;
|
|
max-width: 980px;
|
|
margin: 0 auto;
|
|
padding: 45px;
|
|
}
|
|
.markdown-body table {
|
|
display: table;
|
|
}
|
|
.markdown-body input[type="checkbox"] ~ p {
|
|
margin-top: 0;
|
|
display: inline-block;
|
|
}
|
|
@media (max-width: 767px) {
|
|
.markdown-body {
|
|
padding: 15px;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<article class="markdown-body">
|
|
${html}
|
|
</article>
|
|
</body>
|
|
</html>`
|
|
}
|
|
}
|
|
|
|
export default ExportHtml
|