diff --git a/package.json b/package.json
index a008e56b..81aed5ac 100644
--- a/package.json
+++ b/package.json
@@ -33,7 +33,7 @@
     "filepond-plugin-file-validate-type": "^1.2.6",
     "filepond-plugin-image-preview": "^4.6.10",
     "halo-editor": "^2.8.3",
-    "marked": "^2.1.3",
+    "marked": "^4.0.10",
     "nprogress": "^0.2.0",
     "tiny-pinyin": "^1.3.2",
     "verte": "^0.0.12",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 60f65a19..4734db17 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -32,7 +32,7 @@ specifiers:
   less: ^3.13.1
   less-loader: ^5.0.0
   lint-staged: ^10.5.4
-  marked: ^2.1.3
+  marked: ^4.0.10
   nprogress: ^0.2.0
   prettier: ^1.19.1
   tailwindcss: ^1.9.6
@@ -63,7 +63,7 @@ dependencies:
   filepond-plugin-file-validate-type: 1.2.6_filepond@4.30.3
   filepond-plugin-image-preview: 4.6.10_filepond@4.30.3
   halo-editor: 2.8.3
-  marked: 2.1.3
+  marked: 4.0.10
   nprogress: 0.2.0
   tiny-pinyin: 1.3.2
   verte: 0.0.12
@@ -7824,9 +7824,9 @@ packages:
       object-visit: 1.0.1
     dev: true
 
-  /marked/2.1.3:
-    resolution: {integrity: sha512-/Q+7MGzaETqifOMWYEA7HVMaZb4XbcRfaOzcSsHZEith83KGlvaSG33u0SKu89Mj5h+T8V2hM+8O45Qc5XTgwA==}
-    engines: {node: '>= 10'}
+  /marked/4.0.10:
+    resolution: {integrity: sha512-+QvuFj0nGgO970fySghXGmuw+Fd0gD2x3+MqCWLIPf5oxdv1Ka6b2q+z9RP01P/IaKPMEramy+7cNy/Lw8c3hw==}
+    engines: {node: '>= 12'}
     hasBin: true
     dev: false
 
diff --git a/src/components/Tools/HeaderComment.vue b/src/components/Tools/HeaderComment.vue
index 33e85230..915a545b 100644
--- a/src/components/Tools/HeaderComment.vue
+++ b/src/components/Tools/HeaderComment.vue
@@ -59,7 +59,7 @@
 
 <script>
 import apiClient from '@/utils/api-client'
-import marked from 'marked'
+import { marked } from 'marked'
 
 export default {
   name: 'HeaderComment',
@@ -76,13 +76,13 @@ export default {
   computed: {
     converttedPostComments() {
       return this.postComments.map(comment => {
-        comment.content = marked(comment.content)
+        comment.content = marked.parse(comment.content)
         return comment
       })
     },
     converttedSheetComments() {
       return this.sheetComments.map(comment => {
-        comment.content = marked(comment.content)
+        comment.content = marked.parse(comment.content)
         return comment
       })
     }
diff --git a/src/views/comment/components/CommentTab.vue b/src/views/comment/components/CommentTab.vue
index 7c4dc1ab..75c0aa55 100644
--- a/src/views/comment/components/CommentTab.vue
+++ b/src/views/comment/components/CommentTab.vue
@@ -284,7 +284,7 @@
 </template>
 <script>
 import { mixin, mixinDevice } from '@/mixins/mixin.js'
-import marked from 'marked'
+import { marked } from 'marked'
 import apiClient from '@/utils/api-client'
 
 const postColumns = [
@@ -437,7 +437,7 @@ export default {
     formattedComments() {
       return this.list.data.map(comment => {
         comment.statusProperty = this.commentStatus[comment.status]
-        comment.content = marked(comment.content)
+        comment.content = marked.parse(comment.content)
         return comment
       })
     },
diff --git a/src/views/comment/components/TargetCommentTree.vue b/src/views/comment/components/TargetCommentTree.vue
index 2bd34593..998834d9 100644
--- a/src/views/comment/components/TargetCommentTree.vue
+++ b/src/views/comment/components/TargetCommentTree.vue
@@ -66,7 +66,7 @@
   </div>
 </template>
 <script>
-import marked from 'marked'
+import { marked } from 'marked'
 
 export default {
   name: 'TargetCommentTree',
@@ -79,7 +79,7 @@ export default {
   },
   computed: {
     content() {
-      return marked(this.comment.content)
+      return marked.parse(this.comment.content)
     }
   },
   methods: {
diff --git a/src/views/dashboard/components/RecentCommentTab.vue b/src/views/dashboard/components/RecentCommentTab.vue
index e1280c5d..0e5b4154 100644
--- a/src/views/dashboard/components/RecentCommentTab.vue
+++ b/src/views/dashboard/components/RecentCommentTab.vue
@@ -45,7 +45,7 @@
 <script>
 import apiClient from '@/utils/api-client'
 
-import marked from 'marked'
+import { marked } from 'marked'
 
 export default {
   name: 'RecentCommentTab',
@@ -68,7 +68,7 @@ export default {
   computed: {
     formmatedCommentData() {
       return this.comments.map(comment => {
-        comment.content = marked(comment.content)
+        comment.content = marked.parse(comment.content)
         return comment
       })
     }
diff --git a/src/views/system/About.vue b/src/views/system/About.vue
index 1eb46881..6ed36c92 100644
--- a/src/views/system/About.vue
+++ b/src/views/system/About.vue
@@ -77,7 +77,7 @@
 <script>
 import apiClient from '@/utils/api-client'
 import axios from 'axios'
-import marked from 'marked'
+import { marked } from 'marked'
 import { PageView } from '@/layouts'
 
 const axiosInstance = axios.create({
@@ -136,7 +136,7 @@ export default {
     },
     versionContent() {
       if (this.latestData && this.latestData.body) {
-        return marked(this.latestData.body)
+        return marked.parse(this.latestData.body)
       } else {
         return '暂无内容'
       }