Skip to content

CLAUDE.md

This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.

Development Commands

Build and Development

  • npm run docs:dev - Start VitePress development server
  • npm run docs:build - Build the static site for production
  • npm run docs:preview - Preview the built site locally

No Additional Tools

This project does not include linting, testing, or other development tools. The codebase focuses solely on content generation and site building.

Project Architecture

Technology Stack

  • VitePress: Static site generator for documentation
  • TypeScript: Configuration and utility files
  • Markdown: Content files with frontmatter

Site Structure

This is a multilingual SMS verification service documentation site with the following structure:

  • Root (/): Chinese (Simplified) - Default locale
  • Localized versions: zh-TW/, en/, ja/, ru/, ko/, id/
  • Content categories:
    • encyclopedia/ - Educational articles about SMS verification
    • popular-services/ - Service-specific guides
    • Static pages: intro.md, faq.md, tutorial.md, etc.

Configuration Architecture

The site uses a centralized configuration system:

Main config: .vitepress/config.mts

  • Defines locale configurations for 7 languages
  • Shared navigation and footer settings
  • SEO optimization with structured data
  • Dynamic sidebar generation

Utility functions: .vitepress/utils/sidebar.ts

  • generateEncyclopediaItems() - Dynamically generates sidebar items from encyclopedia markdown files
  • generatePopularServicesItems() - Dynamically generates sidebar items from popular services markdown files
  • Both functions read filesystem and extract titles from markdown headers

Data loaders: *.data.js files

  • VitePress content loaders that transform markdown files into structured data
  • Used for dynamic content generation in each locale

Content Management Pattern

Content Structure:

  • Each locale maintains identical file structure
  • Articles are mirrored across all supported languages
  • Sidebar navigation is auto-generated from actual files

Dynamic Navigation:

  • Sidebar items are generated at build time by reading directory contents
  • Article titles are extracted from markdown # Header content
  • Localized navigation labels based on language codes

SEO Optimization:

  • Structured data (JSON-LD) for organization and services
  • Canonical URLs with proper hreflang tags
  • Dynamic meta tags and Open Graph properties
  • Optimized image loading with preload hints

Key Files and Directories

Configuration:

  • .vitepress/config.mts - Main VitePress configuration
  • .vitepress/utils/sidebar.ts - Sidebar generation utilities
  • package.json - Project dependencies and scripts

Content:

  • index.md - Homepage with hero section and features
  • [locale]/encyclopedia/ - Educational content directories
  • [locale]/popular-services/ - Service-specific guides
  • *.data.js - VitePress data loaders for dynamic content

Assets:

  • public/ - Static assets (images, fonts, scripts)
  • /logo.svg, /homeImg.svg - Key branding assets

Development Guidelines

Adding New Content

  1. Create markdown files in the appropriate language directories
  2. Use consistent frontmatter structure with title and description
  3. Sidebar navigation will auto-generate from file structure
  4. Ensure all locales maintain parallel content structure
  • DO NOT manually edit sidebar items in config
  • Add new articles by creating markdown files in the appropriate directories
  • The generateEncyclopediaItems() and generatePopularServicesItems() functions will automatically include them

Multi-language Support

  • Maintain identical file structures across all locale directories
  • Use the locale parameter in utility functions for language-specific content
  • Keep navigation labels consistent with the established pattern

SEO Considerations

  • The site implements comprehensive SEO optimization
  • Meta tags and structured data are auto-generated
  • Focus on content quality as technical SEO is handled by the configuration

Common Patterns

Adding New Encyclopedia Articles

  1. Create markdown file in encyclopedia/ directory
  2. Start with # Article Title as the first header
  3. The title will be automatically extracted for sidebar navigation
  4. Replicate across all locale directories for consistency

Adding New Service Guides

  1. Create markdown file in popular-services/ directory
  2. Follow the same title extraction pattern
  3. Use consistent naming conventions across locales

Content Frontmatter Structure

yaml
---
title: "Page Title"
description: "Page description for SEO"
# Additional frontmatter as needed
---

This architecture prioritizes content management efficiency while maintaining comprehensive SEO optimization and multi-language support.

SMS-Act 全球领先的在线接码平台