# 确认图标名称是否正确
# 访问 Tabler Icons 官网：https://tabler.io/icons
# 搜索 "calendar"，确认正确的图标名称

<!-- 修复前 -->
<Icon name="tabler:calendar-day" />

<!-- 修复后 -->
<Icon name="tabler:calendar" />

<!-- 修复前 -->
<Icon name="tabler:calendar-day" class="w-5 h-5" />

<!-- 修复后 -->
<Icon name="tabler:calendar" class="w-5 h-5" />

// server/api/visitors.post.ts 第10行
return {
  total: stats.total + stats.today,  // ❌ 错误：重复累加
  today: stats.today,
  online: stats.online,
}

// VisitorStats.vue 和 BlogStats.vue
stats.value = {
  total: data.total + data.today,  // ❌ 重复累加
  today: data.today,
  online: data.online,
}

// 修复前
return {
  total: stats.total + stats.today,  // ❌
  today: stats.today,
  online: stats.online,
}

// 修复后
return {
  total: stats.total,  // ✅ 不再累加
  today: stats.today,
  online: stats.online,
}

// 修复前
stats.value = {
  total: data.total + data.today,  // ❌
  today: data.today,
  online: data.online,
}

// 修复后
stats.value = {
  total: data.total,  // ✅ 直接使用
  today: data.today,
  online: data.online,
}

// 修复前：会删除记录并修改 today
function cleanupOnline(stats: VisitorStats) {
  for (const [ip, record] of Object.entries(stats.todayRecords)) {
    if (now - record.lastVisit > ONLINE_TIMEOUT) {
      delete stats.todayRecords[ip]  // ❌ 副作用
    }
  }
  stats.online = ...
}

// 修复后：只计算在线人数
function calculateOnline(stats: VisitorStats): number {
  let onlineCount = 0
  for (const record of Object.values(stats.todayRecords)) {
    if (now - record.lastVisit <= ONLINE_TIMEOUT) {
      onlineCount++
    }
  }
  return onlineCount  // ✅ 无副作用
}

// 错误代码
const getVisitorId = () => {
  let visitorId = localStorage.getItem('blog_visitor_id')  // ❌ SSR时不可用
  // ...
}

// 添加客户端检测
const isClient = typeof window !== 'undefined'

const getVisitorId = (): string => {
  // SSR 环境检测
  if (typeof localStorage === 'undefined') {
    return 'ssr-' + Math.random().toString(36).substring(2, 15)
  }
  
  // 正常逻辑...
}

// 记录访问
const recordVisit = async () => {
  if (!isClient) return  // 在服务端时直接返回
  // ...
}

# 1. 启动开发服务器
pnpm dev

# 2. 打开浏览器访问
http://localhost:3000

# 3. 打开开发者工具查看控制台
# 应该看到类似日志：
# [Visitor] Recording visit with visitorId: xxx
# [Visitor] Visit recorded: {total: xxx, today: xxx, online: xxx}

# 本地环境：请求1保存数据 → 请求2读取数据 → 数据存在 ✅
# Vercel环境：请求1保存数据 → 请求2读取数据 → 文件不存在 ❌

pnpm add @upstash/redis

npx vercel env pull

pnpm build
npx vercel --prod

// 错误代码
const categories = post.categories || []
for (const [index, categoryName] of categories.entries()) {  // ❌
  // ...
}

// 修复前
const categories = post.categories || []
let currentLevel = stats.categories

for (const [index, categoryName] of categories.entries()) {
  // ...
}

// 修复后
const categories = post.categories || []
let currentLevel = stats.categories

// 确保 categories 是数组
if (Array.isArray(categories)) {
  for (const [index, categoryName] of categories.entries()) {
    if (typeof categoryName !== 'string')
      continue

    const category = findOrCreateCategory(categoryName, currentLevel)
    category.posts++

    if (index < categories.length - 1) {
      if (!category.children)
        category.children = []
      currentLevel = category.children
    }
  }
}

pnpm build
# 应该看到：
# ✓ Prerendered 5 routes in xx seconds
# ✓ Generated public .output/public

// 错误：使用了 @vercel/kv 的变量名
redis = Redis.fromEnv()
// @vercel/kv 需要: UPSTASH_REDIS_REST_URL, UPSTASH_REDIS_REST_TOKEN

// 正确：应该使用 Vercel KV 自动配置的变量名
redis = new Redis({
  url: process.env.KV_REST_API_URL!,      // ✅ Vercel KV 使用 KV_ 前缀
  token: process.env.KV_REST_API_TOKEN!,
})

redis = new Redis({
  url: process.env.KV_REST_API_URL!,
  token: process.env.KV_REST_API_TOKEN!,
})

修复前：
┌─────────┐     ┌─────────┐     ┌─────────┐
│  前端   │────▶│  API    │────▶│  文件   │
└─────────┘     └─────────┘     └─────────┘
                                    ❌ 不持久化

修复后：
┌─────────┐     ┌─────────┐     ┌─────────┐
│  前端   │────▶│  API    │────▶│  Redis  │
└─────────┘     └─────────┘     └─────────┘
                                  ✅ 持久化