Merge pull request #10 from project-trans/dev/auto-description

feat: support to generate meta description head for docs

.gitignore

@@ -30,6 +30,3 @@ coverage/
 
 # macOS
 .DS_Store
-
-# VSCode settings
-.vscode/settings.json

.vscode/settings.json

@@ -0,0 +1,8 @@
+{
+    "cSpell.words": [
+        "iconify",
+        "katex",
+        "pangu",
+        "vuepress"
+    ]
+}

docs/.vitepress/components.d.ts

@@ -12,5 +12,7 @@ declare module 'vue' {
     PageInfo: typeof import('./theme/components/PageInfo.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
+    Starport: typeof import('vue-starport')['Starport']
+    StarportCarrier: typeof import('vue-starport')['StarportCarrier']
   }
 }

docs/.vitepress/config.ts

@@ -4,6 +4,11 @@ import mdPangu from "markdown-it-pangu"
 import katex from 'markdown-it-katex'
 import footnote from 'markdown-it-footnote'
 import { sidebar } from './sidebar'
+import { readFileSync, statSync } from 'node:fs'
+import { join } from 'node:path'
+
+const dir = 'docs'
+const siteTitle = 'SOC-8'
 
 // https://vitepress.dev/reference/site-config
 export default defineConfig({
@@ -26,11 +31,15 @@ export default defineConfig({
       md.use(katex);
     },
   },
-  dir: 'docs',
+  dir,
   lastUpdated: true,
+  head: [
+    ['meta', { property: 'og:title', content: siteTitle }],
+    ['meta', { property: 'og:site_name', content: siteTitle }],
+  ],
   themeConfig: {
     // https://vitepress.dev/reference/default-theme-config
-    siteTitle: 'SOC-8',
+    siteTitle,
     nav,
     sidebar,
 
@@ -53,5 +62,76 @@ export default defineConfig({
       prev: '上一页',
       next: '下一页',
     },
+  },
+  transformHead: (context) => {
+    const head = [...context.head] || []
+
+    const pageSourceFilePath = join(dir, context.pageData.filePath)
+    const pageSourceFileStat = statSync(join(dir, context.pageData.filePath))
+
+    if (pageSourceFileStat.isDirectory()) {
+      return head
+    }
+
+    let pageSourceFileContent = readFileSync(pageSourceFilePath, { encoding: 'utf-8' })
+
+    // remove all frontmatter
+    pageSourceFileContent = pageSourceFileContent.replace(/---[\s\S]*?---/, '')
+
+    // remove markdown heading markup but keep the text content
+    pageSourceFileContent = pageSourceFileContent.replace(/^(#+)\s+(.*)/gm, '$2')
+    // remove markdown link markup but keep the text content
+    pageSourceFileContent = pageSourceFileContent.replace(/\[([^\]]+)\]\([^)]+\)/gm, '$1')
+    // remove markdown image markup but keep the text content
+    pageSourceFileContent = pageSourceFileContent.replace(/\!\[([^\]]+)\]\([^)]+\)/gm, '$1')
+    // remove markdown bold markup but keep the text content
+    pageSourceFileContent = pageSourceFileContent.replace(/\*\*([^*]+)\*\*/gm, '$1')
+    pageSourceFileContent = pageSourceFileContent.replace(/__([^*]+)__/gm, '$1')
+    // remove markdown italic markup but keep the text content
+    pageSourceFileContent = pageSourceFileContent.replace(/\*([^*]+)\*/gm, '$1')
+    pageSourceFileContent = pageSourceFileContent.replace(/_([^*]+)_/gm, '$1')
+    // remove markdown code markup but keep the text content
+    pageSourceFileContent = pageSourceFileContent.replace(/`([^`]+)`/gm, '$1')
+    // remove markdown code block markup but keep the text content
+    pageSourceFileContent = pageSourceFileContent.replace(/```([^`]+)```/gm, '$1')
+    // remove markdown table header markup but keep the text content
+    pageSourceFileContent = pageSourceFileContent.replace(/\|:?-+:?\|/gm, '|')
+    // remove markdown table cell markup but keep the text content
+    pageSourceFileContent = pageSourceFileContent.replace(/\|([^|]+)\|/gm, '$1')
+
+    // remove specific html tags completely
+    const tags = ['']
+    tags.forEach((tag) => {
+      pageSourceFileContent = pageSourceFileContent.replace(new RegExp(`<${tag}[^>]*>[\\s\\S]*?<\\/${tag}>`, 'g'), '')
+    })
+
+    // remove specific html tags but keep the text content
+    const tagsToKeepContent = ['u', 'Containers', 'img', 'a']
+    tagsToKeepContent.forEach((tag) => {
+      pageSourceFileContent = pageSourceFileContent.replace(new RegExp(`<${tag}[^>]*>([\\s\\S]*?)<\\/${tag}>`, 'g'), '$1')
+    })
+
+    // remove all new lines (either \r, \n)
+    pageSourceFileContent = pageSourceFileContent.replace(/[\r|\n]/gm, '')
+
+    // calculate the first 200 characters of the page content
+    let pageContent = pageSourceFileContent.slice(0, 200)
+    // if pageSourceFileContent is longer than 200 characters, add ellipsis
+    if (pageSourceFileContent.length > 200) {
+      pageContent += '...'
+    }
+
+    // add the page content as meta description
+    head.push([
+      'meta',
+      { name: 'description', content: pageContent }
+    ])
+
+    head.push([
+      'meta',
+      { property: 'og:description', content: pageContent }
+    ])
+
+    return head
   }
 })