W3C MCP Server

Японская версия README

MCP-сервер для доступа к веб-спецификациям W3C/WHATWG/IETF. Предоставляет ИИ-ассистентам доступ к официальным данным о веб-стандартах, включая спецификации, определения WebIDL, свойства CSS и элементы HTML.

Установка

npm install -g @shuji-bonji/w3c-mcp

Или используйте напрямую через npx:

npx @shuji-bonji/w3c-mcp

Конфигурация

Claude Desktop

Добавьте в файл конфигурации Claude Desktop:

macOS: ~/Library/Application Support/Claude/claude_desktop_config.json Windows: %APPDATA%\Claude\claude_desktop_config.json Linux: ~/.config/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "w3c": {
      "command": "npx",
      "args": ["-y", "@shuji-bonji/w3c-mcp"]
    }
  }
}

Claude Code

Добавьте сервер с помощью CLI claude mcp:

claude mcp add w3c -- npx -y @shuji-bonji/w3c-mcp

Или отредактируйте ~/.claude.json / .mcp.json на уровне проекта вручную, используя тот же блок mcpServers, показанный выше.

Cursor

Добавьте в настройки Cursor MCP (.cursor/mcp.json в вашем проекте или глобальные настройки):

{
  "mcpServers": {
    "w3c": {
      "command": "npx",
      "args": ["-y", "@shuji-bonji/w3c-mcp"]
    }
  }
}

Доступные инструменты

Обнаружение спецификаций

list_w3c_specs

Список веб-спецификаций W3C/WHATWG/IETF с возможностью фильтрации.

Параметры:

• organization (необязательно): Фильтр по организации - "W3C", "WHATWG", "IETF" или "all"

• keyword (необязательно): Фильтр по ключевому слову в названии или короткому имени

• category (необязательно): Фильтр по категории

• limit (необязательно): Максимальное количество результатов (по умолчанию: 50)

get_w3c_spec

Получение подробной информации о конкретной веб-спецификации.

Параметры:

• shortname (обязательно): Короткое имя спецификации (например, "service-workers", "appmanifest", "fetch")

search_w3c_specs

Поиск веб-спецификаций по строке запроса.

Параметры:

• query (обязательно): Поисковый запрос (например, "service worker", "manifest", "storage")

• limit (необязательно): Максимальное количество результатов (по умолчанию: 20)

WebIDL

get_webidl

Получение определений интерфейсов WebIDL для спецификации. WebIDL определяет API JavaScript.

Параметры:

• shortname (обязательно): Короткое имя спецификации (например, "service-workers", "fetch", "dom")

list_webidl_specs

Список всех спецификаций, для которых доступны определения WebIDL.

CSS

get_css_properties

Получение определений свойств CSS из конкретной спецификации или всех спецификаций.

Параметры:

• spec (необязательно): Короткое имя спецификации (например, "css-grid-1", "css-flexbox-1")

• property (необязательно): Поиск конкретного свойства CSS по имени

list_css_specs

Список всех спецификаций CSS, для которых доступны определения свойств.

Элементы HTML

get_html_elements

Получение определений элементов HTML из конкретной спецификации или всех спецификаций.

Параметры:

• spec (необязательно): Короткое имя спецификации (например, "html", "svg")

• element (необязательно): Поиск конкретного элемента по имени (например, "video", "canvas")

list_element_specs

Список всех спецификаций, для которых доступны определения элементов HTML.

PWA

get_pwa_specs

Получение всех спецификаций, связанных с Progressive Web App (PWA).

Параметры:

• coreOnly (необязательно): Если true, возвращает только основные спецификации PWA (Service Worker, Manifest, Push, Notifications)

get_spec_dependencies

Получение базовой информации о спецификации.

Примечание: Данные о зависимостях (dependencies / dependents) еще не предоставляются вышестоящим пакетом web-specs, поэтому эти поля в настоящее время возвращают пустые массивы. На данный момент надежны только базовые метаданные спецификации.

Параметры:

• shortname (обязательно): Короткое имя спецификации

Примеры использования

Поиск API Service Worker

Use the get_webidl tool with shortname "service-workers" to see the ServiceWorker interface definitions.

Изучение технологий PWA

Use get_pwa_specs to see all PWA-related specifications, then use get_w3c_spec for details on each one.

Поиск свойств CSS Grid

Use get_css_properties with spec "css-grid-1" to see all CSS Grid layout properties.

Поиск API хранилища (Storage)

Use search_w3c_specs with query "storage" to find all storage-related specifications.

Источники данных

Этот MCP-сервер использует следующие пакеты данных W3C/webref:

Эти пакеты поддерживаются W3C и предоставляют машиночитаемые данные, извлеченные из официальных спецификаций.

Репозитории GitHub:

• https://github.com/w3c/browser-specs

• https://github.com/w3c/webref

Режим отладки

Включите ведение журнала отладки с помощью переменных окружения:

# Enable debug logging
W3C_MCP_DEBUG=true npx @shuji-bonji/w3c-mcp

# Enable performance logging only
W3C_MCP_PERF=true npx @shuji-bonji/w3c-mcp

Вывод отладки включает:

• Аргументы вызова инструментов

• Время выполнения

• Производительность загрузки данных

Архитектура

src/
├── index.ts           # MCP server entry point
├── constants/
│   └── index.ts       # Centralized configuration constants
├── data/
│   └── loader.ts      # Data loading with caching
├── tools/             # Tool implementations
│   ├── list-specs.ts
│   ├── get-spec.ts
│   ├── search-specs.ts
│   ├── get-webidl.ts
│   ├── get-css.ts
│   ├── get-elements.ts
│   └── get-pwa-specs.ts
├── schemas/
│   └── index.ts       # Zod validation schemas
├── errors/
│   └── index.ts       # Custom error classes
├── utils/
│   ├── logger.ts      # Debug logging utilities
│   ├── mapper.ts      # Spec data mapping utilities
│   ├── search.ts      # Generic search utilities
│   └── suggestions.ts # Suggestion generation utilities
└── types/
    └── index.ts       # TypeScript type definitions

tests/
├── setup.ts           # Test setup
├── data/              # Data loader tests
├── tools/             # Tool tests
└── integration/       # MCP server integration tests

Производительность

• Запуск: ~70 мс параллельной предварительной загрузки всех данных

• Поиск спецификации: O(1) с использованием индекса на основе Map

• Поиск: Оптимизирован с ранним завершением при точном совпадении

Разработка

# Clone the repository
git clone https://github.com/shuji-bonji/w3c-mcp.git
cd w3c-mcp

# Install dependencies
npm install

# Build
npm run build

# Run in development mode
npm run dev

# Run with debug logging
W3C_MCP_DEBUG=true npm start

# Run tests
npm test

# Run tests with coverage
npm run test:coverage

# Lint code
npm run lint

# Format code
npm run format

# Lint + format (auto-fix)
npm run check

Лицензия

MIT