Add remark-toc plugin.

Add plugin for generating table of content automatically for markdown files.

astro.config.mjs

@@ -1,6 +1,7 @@
 import { defineConfig } from 'astro/config';
 import sitemap from "@astrojs/sitemap";
 import vue from "@astrojs/vue";
+import remarkToc from 'remark-toc';
 
 // https://astro.build/config
 export default defineConfig({
@@ -26,7 +27,10 @@ export default defineConfig({
       // Add custom transformers: https://shiki.style/guide/transformers
       // Find common transformers: https://shiki.style/packages/transformers
       transformers: []
-    }
+    },
+    remarkPlugins: [
+      [remarkToc, { heading: "(table[ -]of[ -])?contents?|toc|目录" }]
+    ],
   },
   site: 'https://lishouzhong.com',
   integrations: [

package-lock.json

@@ -14,6 +14,7 @@
         "astro": "^4.9.2",
         "bignumber.js": "^9.1.2",
         "pinyin-pro": "^3.22.0",
+        "remark-toc": "^9.0.0",
         "typescript": "^5.4.5",
         "vue": "^3.4.29"
       }
@@ -1903,6 +1904,11 @@
         "@types/node": "*"
       }
     },
+    "node_modules/@types/ungap__structured-clone": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmmirror.com/@types/ungap__structured-clone/-/ungap__structured-clone-1.2.0.tgz",
+      "integrity": "sha512-ZoaihZNLeZSxESbk9PUAPZOlSpcKx81I1+4emtULDVmBLkYutTcMlCj2K9VNlf9EWODxdO6gkAqEaLorXwZQVA=="
+    },
     "node_modules/@types/unist": {
       "version": "3.0.2",
       "resolved": "https://registry.npmmirror.com/@types/unist/-/unist-3.0.2.tgz",
@@ -4357,6 +4363,24 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/mdast-util-toc": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmmirror.com/mdast-util-toc/-/mdast-util-toc-7.1.0.tgz",
+      "integrity": "sha512-2TVKotOQzqdY7THOdn2gGzS9d1Sdd66bvxUyw3aNpWfcPXCLYSJCCgfPy30sEtuzkDraJgqF35dzgmz6xlvH/w==",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "@types/ungap__structured-clone": "^1.0.0",
+        "@ungap/structured-clone": "^1.0.0",
+        "github-slugger": "^2.0.0",
+        "mdast-util-to-string": "^4.0.0",
+        "unist-util-is": "^6.0.0",
+        "unist-util-visit": "^5.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/merge-stream": {
       "version": "2.0.0",
       "resolved": "https://registry.npmmirror.com/merge-stream/-/merge-stream-2.0.0.tgz",
@@ -5575,6 +5599,19 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/remark-toc": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmmirror.com/remark-toc/-/remark-toc-9.0.0.tgz",
+      "integrity": "sha512-KJ9txbo33GjDAV1baHFze7ij4G8c7SGYoY8Kzsm2gzFpbhL/bSoVpMMzGa3vrNDSWASNd/3ppAqL7cP2zD6JIA==",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "mdast-util-toc": "^7.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/request-light": {
       "version": "0.7.0",
       "resolved": "https://registry.npmmirror.com/request-light/-/request-light-0.7.0.tgz",

package.json

@@ -16,6 +16,7 @@
     "astro": "^4.9.2",
     "bignumber.js": "^9.1.2",
     "pinyin-pro": "^3.22.0",
+    "remark-toc": "^9.0.0",
     "typescript": "^5.4.5",
     "vue": "^3.4.29"
   }

src/components/article/ArticleBody.astro

@@ -45,7 +45,7 @@ const articlePrettyName = article!.id.split("/").pop()!.replace(".md", "");
     flex-wrap: wrap;
   }
   /* reduce indent of TOC list */
-  :global(.article-title + ul) {
+  :global(.article-title ~ ul:nth-of-type(1)) {
     margin: 1em 0 1em 0;
     padding: 0 0 0 20px;
   }