VideoCaptioner Documentation

File: docs/README.md Copy Chapter

VideoCaptioner 文档

这是 VideoCaptioner 项目的文档源文件，使用 VitePress 构建。

📚 在线查看 Copy Chapter

文档已自动部署到 GitHub Pages：

https://weifeng2333.github.io/VideoCaptioner/

🚀 本地开发 Copy Chapter

安装依赖 Copy Section

npm install

启动开发服务器 Copy Section

npm run docs:dev

访问 http://localhost:5173 查看文档

构建文档 Copy Section

npm run docs:build

构建产物位于 docs/.vitepress/dist/

预览构建结果 Copy Section

npm run docs:preview

📁 目录结构 Copy Chapter

docs/
├── .vitepress/
│   ├── config.mts          # VitePress 配置文件（含 SEO 优化）
│   └── theme/              # 自定义主题（可选）
├── public/                 # 静态资源（图片、Logo、robots.txt）
├── guide/                  # 中文使用指南
│   ├── getting-started.md
│   ├── configuration.md
│   └── ...
├── config/                 # 中文配置文档
│   ├── llm.md
│   ├── asr.md
│   └── ...
├── dev/                    # 中文开发者文档
│   ├── architecture.md
│   └── ...
├── en/                     # 英文文档（镜像中文结构）
│   ├── guide/
│   ├── config/
│   └── dev/
└── index.md                # 中文首页

✍️ 贡献文档 Copy Chapter

添加新页面 Copy Section

1. 在对应目录下创建 Markdown 文件
2. 添加 Frontmatter SEO 优化（重要！）：

---
title: 页面标题 - VideoCaptioner
head:
  - - meta
    - name: keywords
      content: 关键词1,关键词2,关键词3
---

# 页面标题

内容...

3. 在 .vitepress/config.mts 的 sidebar 中添加链接
4. 提交 PR

编辑现有页面 Copy Section

直接编辑 Markdown 文件即可，支持：

• Markdown 扩展语法：表格、代码块、提示框等
• Vue 组件：可在 Markdown 中使用 Vue 组件
• 自定义容器：::: tip, ::: warning, ::: danger

示例：

::: tip 提示
这是一个提示框
:::

::: warning 注意
这是一个警告框
:::

::: danger 危险
这是一个危险警告框
:::

文档规范 Copy Section

• 文件名：使用小写字母和连字符（如 getting-started.md）
• 标题：使用清晰的层级结构（# → ## → ###）
• 代码块：标注语言类型以启用语法高亮
• 图片：放在 public/ 目录，使用 /image.png 引用
• 链接：内部链接使用相对路径（如 /guide/getting-started）
• SEO：每个页面都应添加 title、description 和 keywords

🔍 SEO 优化 Copy Chapter

本文档系统已经过全面 SEO 优化，详情请查看 SEO_OPTIMIZATION.md。

已实施的 SEO 功能 Copy Section

✅ 基础 SEO

• Title 标签优化
• Meta Description 和 Keywords
• Open Graph（社交媒体卡片）
• Twitter Card
• JSON-LD 结构化数据
• Sitemap 自动生成
• robots.txt
• Canonical URL

✅ 技术 SEO

• 响应式设计
• Clean URLs
• 快速加载（Vite 优化）
• HTTPS（GitHub Pages）

提交到搜索引擎 Copy Section

部署后需要手动提交到搜索引擎：

1. Google Search Console

   • 访问 https://search.google.com/search-console
   • 添加网站并验证
   • 提交 sitemap: https://weifeng2333.github.io/VideoCaptioner/sitemap.xml

2. Bing Webmaster Tools

   • 访问 https://www.bing.com/webmasters
   • 添加网站并验证
   • 提交 sitemap

3. 百度站长平台

   • 访问 https://ziyuan.baidu.com/
   • 添加网站并验证
   • 提交 sitemap

SEO 检查工具 Copy Section

• Google PageSpeed Insights
• Google Rich Results Test
• Open Graph Debugger
• Twitter Card Validator

🌐 多语言支持 Copy Chapter

文档支持中英双语：

• 中文：docs/ 根目录
• 英文：docs/en/ 目录

添加新语言：

1. 在 docs/ 下创建语言目录（如 ja/）
2. 在 .vitepress/config.mts 中添加 locale 配置
3. 复制文档结构并翻译内容

🔧 技术栈 Copy Chapter

• VitePress: 基于 Vite 的静态站点生成器
• Vue 3: 组件化开发
• TypeScript: 类型安全的配置

📝 更新文档 Copy Chapter

文档更新会自动触发 GitHub Actions 部署：

1. 提交文档修改到 docs/ 目录
2. 推送到 master 或 main 分支
3. GitHub Actions 自动构建并部署
4. 约 2-3 分钟后更新生效

❓ 常见问题 Copy Chapter

本地开发时看不到样式？ Copy Section

确保已安装依赖：

npm install

如何添加自定义样式？ Copy Section

在 docs/.vitepress/theme/ 目录下创建自定义主题：

// docs/.vitepress/theme/index.ts
import DefaultTheme from "vitepress/theme";
import "./custom.css";

export default DefaultTheme;

如何配置搜索功能？ Copy Section

VitePress 默认提供本地搜索，已在 config.mts 中配置。

如何优化图片？ Copy Section

1. 使用图片压缩工具（如 TinyPNG）
2. 考虑使用 WebP 格式
3. 添加 loading="lazy" 属性

如何添加 Google Analytics？ Copy Section

在 config.mts 的 head 中添加：

([
  "script",
  {
    async: true,
    src: "https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX",
  },
],
  [
    "script",
    {},
    `
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXXXXX');
`,
  ]);

更多 VitePress 使用方法请参考 官方文档。

更多 SEO 优化细节请查看 SEO_OPTIMIZATION.md。

2. Official Technical Reference & Guides (WEIFENG2333/WEIFENG2333.github.io) Copy Chapter

Welcome to GitHub Pages Copy Chapter

You can use the editor on GitHub to maintain and preview the content for your website in Markdown files.

Whenever you commit to this repository, GitHub Pages will run Jekyll to rebuild the pages in your site, from the content in your Markdown files.

Markdown Copy Section

Markdown is a lightweight and easy-to-use syntax for styling your writing. It includes conventions for

Syntax highlighted code block

# Header 1
## Header 2
### Header 3

- Bulleted
- List

1. Numbered
2. List

**Bold** and _Italic_ and `Code` text

[Link](url) and

For more details see GitHub Flavored Markdown.

Jekyll Themes Copy Section

Your Pages site will use the layout and styles from the Jekyll theme you have selected in your repository settings. The name of this theme is saved in the Jekyll _config.yml configuration file.

Support or Contact Copy Section

Having trouble with Pages? Check out our documentation or contact support and we’ll help you sort it out.