Merge pull request #146 from YoungYo/master

Markdown 增加对 mermaid 渲染的支持；前台 Markdown 支持图片居中显示
linhaojun857 · Sep 3, 2023 · 60a8fbd · 60a8fbd
2 parents f1ba975 + af33601
commit 60a8fbd
Show file tree

Hide file tree

Showing 8 changed files with 2,079 additions and 21 deletions.
diff --git a/aurora-vue/aurora-admin/package-lock.json b/aurora-vue/aurora-admin/package-lock.json
diff --git a/aurora-vue/aurora-admin/package.json b/aurora-vue/aurora-admin/package.json
@@ -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",

diff --git a/aurora-vue/aurora-admin/public/index.html b/aurora-vue/aurora-admin/public/index.html
@@ -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>

diff --git a/aurora-vue/aurora-admin/src/main.js b/aurora-vue/aurora-admin/src/main.js
@@ -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)