Merge pull request #146 from YoungYo/master

Markdown 增加对 mermaid 渲染的支持;前台 Markdown 支持图片居中显示
master
linhaojun857 3 years ago committed by GitHub
commit 60a8fbd859
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

File diff suppressed because it is too large Load Diff

@ -8,6 +8,7 @@
"deploy": "node deploy.js"
},
"dependencies": {
"@agoose77/markdown-it-mermaid": "^1.1.0",
"@iktakahiro/markdown-it-katex": "^4.0.1",
"axios": "^0.27.2",
"core-js": "^3.8.3",

@ -8,6 +8,7 @@
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title>后台管理系统</title>
<script src="<%= BASE_URL %>lib/js/prism.js" data-manual></script>
<script src="https://unpkg.com/mermaid/dist/mermaid.min.js"></script>
<link rel="stylesheet" href="<%= BASE_URL %>lib/css/prism.css" />
</head>
<body>

@ -25,6 +25,7 @@ import VueCalendarHeatmap from 'vue-calendar-heatmap'
import tagCloud from './components/tag-cloud'
import dayjs from 'dayjs'
import Md_Katex from '@iktakahiro/markdown-it-katex'
import mermaidPlugin from "@agoose77/markdown-it-mermaid";
Vue.config.productionTip = false
Vue.prototype.config = config
@ -35,7 +36,7 @@ Vue.use(VueCalendarHeatmap)
Vue.use(VueAxios, axios)
Vue.component('v-chart', ECharts)
Vue.prototype.$moment = dayjs
mavonEditor.markdownIt.set({}).use(Md_Katex);
mavonEditor.markdownIt.set({}).use(Md_Katex).use(mermaidPlugin);
Vue.filter('date', function (value, formatStr = 'YYYY-MM-DD') {
return dayjs(value).format(formatStr)

File diff suppressed because it is too large Load Diff

@ -8,6 +8,7 @@
"deploy": "node deploy.js"
},
"dependencies": {
"@agoose77/markdown-it-mermaid": "^1.1.0",
"@iktakahiro/markdown-it-katex": "^4.0.1",
"axios": "^0.27.2",
"core-js": "^3.8.3",

@ -1,3 +1,4 @@
import mermaidPlugin from "@agoose77/markdown-it-mermaid";
export default function markdownToHtml(content: any) {
const MarkdownIt = require('markdown-it')
const md = new MarkdownIt({
@ -15,5 +16,6 @@ export default function markdownToHtml(content: any) {
.use(require('markdown-it-ins')) // 插入插件
.use(require('markdown-it-mark')) // 标记插件
.use(require('@iktakahiro/markdown-it-katex'))
.use(mermaidPlugin)
return md.render(content)
}

@ -470,6 +470,12 @@ export default defineComponent({
}
}
}
.markdown-body .hljs-center {
text-align: center;
display: flex;
justify-content: center;
align-items: center;
}
</style>
<style lang="scss" scoped>
.my-gap {

Loading…
Cancel
Save