feat: add article metadata (word count, reading time) and optimize config

Author: magisk317

.gitignore

@@ -1,4 +1,38 @@
+# Node.js
 node_modules
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+.pnpm-store
+
+# VitePress / Build
 dist
-.vitepress/cache
-.vitepress/dist
+docs/.vitepress/dist
+docs/.vitepress/cache
+docs/.vitepress/theme/node_modules
+docs/.vitepress/theme/.vitepress
+coverage
+.turbo
+.nyc_output
+
+# System Files
+.DS_Store
+Thumbs.db
+.fsevents_cache
+
+# Editors
+.vscode
+.idea
+*.suo
+*.ntvs
+*.njsproj
+*.sln
+
+# Environment
+.env
+.env.local
+.env.*.local
+
+# Logs
+*.log

docs/.vitepress/config.ts

@@ -1,11 +1,20 @@
 import { defineConfig } from 'vitepress';
+import fs from 'fs';
+import path from 'path';
 
 export default defineConfig({
     title: 'NapLink',
     description: '现代化的 NapCat WebSocket 客户端 SDK',
     base: '/',  // 组织主页使用根路径
 
     themeConfig: {
+        lastUpdated: {
+            text: '最后更新于',
+            formatOptions: {
+                dateStyle: 'short',
+                timeStyle: 'medium'
+            }
+        },
         logo: '/logo.svg',
 
         nav: [
@@ -67,5 +76,33 @@ export default defineConfig({
         search: {
             provider: 'local'
         }
+    },
+
+    transformPageData(pageData) {
+        // Content might not be available in pageData, read from file
+        let content = '';
+        // pageData.filePath seems to be relative in this version, so we force construction
+        const absolutePath = path.resolve(process.cwd(), 'docs', pageData.relativePath);
+
+        if (absolutePath) {
+            try {
+                content = fs.readFileSync(absolutePath, 'utf-8');
+            } catch (e) {
+
+            }
+        }
+
+        // CJK characters count
+        const cjkRegex = /[\u4e00-\u9fa5]/g;
+        const cjkCount = (content.match(cjkRegex) || []).length;
+        // Latin words count
+        const wordRegex = /[a-zA-Z0-9_\-]+/g;
+        const wordCount = (content.match(wordRegex) || []).length;
+
+        const totalCount = cjkCount + wordCount;
+        const readTime = Math.ceil(totalCount / 400); // Assume 400 chars/min reading speed
+
+        pageData.frontmatter.wordCount = totalCount;
+        pageData.frontmatter.readingTime = readTime;
     }
 });

docs/.vitepress/theme/ArticleMetadata.vue

@@ -0,0 +1,53 @@
+<script setup>
+import { useData } from 'vitepress'
+import { computed } from 'vue'
+
+const { page, theme } = useData()
+
+const wordCount = computed(() => page.value.frontmatter.wordCount)
+const readingTime = computed(() => page.value.frontmatter.readingTime)
+const lastUpdated = computed(() => {
+    // If VitePress default lastUpdated date handling is used, it might be available. 
+    // However, VitePress usually shows it at the bottom.
+    // We can also format the timestamp if `lastUpdated` timestamp is available.
+    // For now, let's focus on wordCount and readingTime as lastUpdated is natively handled by themeConfig, 
+    // but the user asked for a "template" to display elements. 
+    // Let's show all if possible, or just the custom ones.
+    return page.value.lastUpdated
+})
+</script>
+
+<template>
+  <div class="article-metadata" v-if="wordCount || readingTime">
+    <span class="meta-item" v-if="wordCount">
+      <span class="icon">📝</span>
+      <span class="text">字数: {{ wordCount }}</span>
+    </span>
+    <span class="meta-item" v-if="readingTime">
+      <span class="icon">⏱️</span>
+      <span class="text">阅读时间: {{ readingTime }} 分钟</span>
+    </span>
+  </div>
+</template>
+
+<style scoped>
+.article-metadata {
+  margin-top: 1rem;
+  margin-bottom: 2rem;
+  display: flex;
+  gap: 1.5rem;
+  align-items: center;
+  color: var(--vp-c-text-2);
+  font-size: 0.9rem;
+}
+
+.meta-item {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.icon {
+  font-size: 1.1em;
+}
+</style>

docs/.vitepress/theme/custom.css

@@ -0,0 +1 @@
+/* Custom styles */

docs/.vitepress/theme/index.ts

@@ -0,0 +1,14 @@
+import DefaultTheme from 'vitepress/theme'
+import ArticleMetadata from './ArticleMetadata.vue'
+import { h } from 'vue'
+import './custom.css'
+
+export default {
+    extends: DefaultTheme,
+    Layout: () => {
+        return h(DefaultTheme.Layout, null, {
+            // Use the doc-before slot to insert metadata before the content
+            'doc-before': () => h(ArticleMetadata)
+        })
+    }
+}