i18n-expert

name	i18n-expert
description	This skill should be used when setting up, auditing, or enforcing internationalization/localization in UI codebases (React/TS, i18next or similar, JSON locales), including installing/configuring the i18n framework, replacing hard-coded strings, ensuring en-US/zh-CN coverage, mapping error codes to localized messages, and validating key parity, pluralization, and formatting.
zh_description	用于i18n、expert，支持开发、调试、评审和交付。
version	1.0.0
author	seaworld008
source	in-house
source_url
tags	["development", "expert", "i18n"]
created_at	2026-03-04
updated_at	2026-03-20
quality	4
complexity	intermediate

I18n Expert

Overview

Deliver a complete i18n setup + audit pass: configure the i18n framework, replace user-facing strings with keys, ensure locale parity, and validate pluralization/formatting for en-US and zh-CN.

Core Capabilities

• Library selection and setup (React, Next.js, Vue).
• Key architecture and locale file organization.
• Translation generation and quality strategy (AI, professional, manual).
• Routing and language detection/switching.
• SEO and metadata localization (when applicable).
• RTL support (only if RTL locales are in scope).

Scope Inputs (ask if unclear)

• Framework and routing style.
• Existing i18n state (none, partial, legacy).
• Target locales (default: en-US + zh-CN).
• Translation quality needs (AI vs professional vs manual).
• Locale formats in use (JSON, YAML, PO, XLIFF).
• Formality/cultural requirements (if any).

Workflow (Audit -> Fix -> Validate)

1. Confirm scope and locale targets

• Identify the i18n framework and locale locations.
• Confirm locales; default to en-US + zh-CN when specified.

2. Setup i18n baseline (if missing)

• Choose a framework-appropriate library (e.g., React: react-i18next; Next.js: next-intl; Vue: vue-i18n).
• Install packages and create the i18n entry/config file.
• Wire the provider at the app root and load locale resources.
• Add a language switcher and persistence (route/param/localStorage) as appropriate.
• Establish locale file layout and key namespaces.
• If routing is locale-aware, define the locale segment strategy early (subpath, subdomain, query param).
• If metadata is user-facing, include translation for titles/descriptions.

3. Audit key usage and locale parity

• Run:

  python scripts/i18n_audit.py --src <src-root> --locale <path/to/en-US.json> --locale <path/to/zh-CN.json>
  

• Treat missing keys/parity gaps as blockers.
• Manually verify dynamic keys (t(var)).

4. Find raw user-facing strings

• Search:

  rg -n --glob '<src>/**/*.{ts,tsx,js,jsx}' "<[^>]+>[^<{]*[A-Za-z][^<{]*<"
  rg -n --glob '<src>/**/*.{ts,tsx,js,jsx}'