i18n
i18n skill establishes the workflow and standards for internationalization, ensuring all user-visible text is properly translated and managed across supported languages. It covers key structure using namespaced dot notation, the critical process of adding new text to every locale directory, and validation through automated checks. Use this skill when adding new user-facing text, creating components with translatable content, or reviewing code for i18n compliance.
i18n skill provides standards and workflow for adding user-facing text with proper internationalization compliance across all supported languages.
AI-generated summary based on this skill's SKILL.md
Decision gist · record as of 2026-07-27
i18n skill provides standards and workflow for adding user-facing text with proper internationalization compliance across all supported languages. i18n skill establishes the workflow and standards for internationalization, ensuring all user-visible text is properly translated and managed across supported languages. It covers key structure using namespaced dot notation, the critical process of adding new text to every locale directory, and validation through automated checks. Use this skill when adding new user-facing text, creating components with translatable content, or reviewing code for i18n compliance.
Use it when
- i18n establishes a three-step workflow: first, define your translation key using dot notation in all locale files.
- i18n supports configuring new languages by creating a new locale directory with the appropriate language code (e.g., `zh-CN`, `fr-FR`).
Verify before relying
Read SKILL.md below before installing (1 file). Open directory: indexed for reading, not audited.
Install
iOfficeAI/AionUi/i18n · repository language: TypeScript
Open directory. Skills are indexed for reading, not audited. Review a skill's body before installing it.
Frequently asked questions
AI-generated answers based on this skill's SKILL.md and metadata
How do I add translations to the i18n app?
i18n provides a structured workflow for adding translations. Start by creating or updating translation keys in your locale files using namespaced dot notation (e.g., `common.button.submit`). Add the key to every supported language directory simultaneously—never add to one locale without updating all others. Use the i18n module's key management system to ensure consistency, then run validation checks to confirm all keys exist across locales before deploying.
What is the i18n workflow for new text in components?
i18n establishes a three-step workflow: first, define your translation key using dot notation in all locale files; second, import the i18n hook or provider in your component and reference the key (avoid hardcoding strings); third, run i18n compliance checks to detect any remaining hardcoded text. This ensures user-facing text is translatable and maintains consistency across all supported languages from the start.
How do I add a new language with i18n?
i18n supports configuring new languages by creating a new locale directory with the appropriate language code (e.g., `zh-CN`, `fr-FR`). Copy the structure from an existing locale, then populate translation files with keys matching your namespace hierarchy. Update your i18n configuration to register the new locale, and regenerate type definitions if using TypeScript. Validate that all keys are present in the new language before enabling it.
How does i18n help review code for hardcoded strings?
i18n includes compliance review tools that scan components for hardcoded user-facing text and flag i18n violations. Run automated checks across your codebase to identify strings that should be moved into translation files. The skill guides you through refactoring violations by extracting text into properly namespaced keys, ensuring all visible content flows through the i18n system for consistent multi-language support.
What does i18n type generation and validation involve?
i18n can regenerate TypeScript type definitions from your translation files, ensuring type safety when accessing keys. Validation checks confirm all keys exist across every supported locale, catching missing translations before deployment. Use these automated processes to maintain consistency and prevent runtime errors from referencing undefined translation keys.
How should i18n locale files be organized?
i18n recommends organizing locale files by language code directories (e.g., `en`, `zh-CN`) with namespaced JSON or YAML files inside (e.g., `common.json`, `errors.json`). Use dot notation for nested keys to keep structure flat and queryable. This organization scales across multiple languages and makes it easy to locate and update specific translation domains without duplicating keys.
SKILL.md
Rendered from the published skill. Quoted content, verbatim.
i18n Skill
Standards and workflow for internationalization. All user-visible text must use i18n.
Announce at start: "I'm using i18n skill to ensure proper internationalization."
IMPORTANT: Read Config First
Before doing any i18n work, always read src/common/config/i18n-config.json to get the current list of supported languages and modules. Never assume a fixed number — languages and modules may have been added or removed since this skill was written.
cat src/common/config/i18n-config.json
This file is the single source of truth. All scripts, runtime code, and this workflow depend on it.
File Structure
``` src/common/config/i18n-config.json # Single source of truth: languages, modules src/renderer/i18n/ ├── index.ts # i18next configuration ├── i18n-keys.d.ts # AUTO-GENERATED — do not edit
(truncated - see the full file via the links below)
File tree — 1 file
.claude/skills/i18n/SKILL.md
Let your AI agent find skills like this
Example. Real query, live index.
You found this page by searching. An agent finds it by wishing: SkillFed indexes 56,283 agent skills by what they can do, searchable in plain language.
wish › “Add new user-facing text with proper i18n compliance”
Give your agent the search over MCP, or paste the wish link into any chat. No install? Search from any chat →
Related skills
This skill equips frontend developers with patterns for adding internationalization to React applications, covering translation hooks, locale-sensitive formatting for currency and lists, date handling with dayjs, and bidirectional text support. It provides bundled references for ICU MessageFormat pluralization, the Trans component for rich text, and implementation checklists to ensure all user-facing content respects locale conventions.
Master the distinction between internationalization (i18n) and localization (l10n) to build globally-ready applications. This skill covers architecture patterns for organizing translation files, naming conventions for translation keys, and implementation examples across React, Vue, and Next.js frameworks. You'll also learn to handle complex scenarios like pluralization, date/number/currency formatting using the Intl API, and support for right-to-left languages.
This skill guides you through implementing internationalization across web and mobile applications using industry-standard libraries like i18next and expo-localization. Learn to organize translation files, handle locale-aware formatting for dates and currency, support right-to-left layouts, and manage language preferences without page reloads.
I18n provides internationalization infrastructure for LobeHub projects built on react-i18next. Define user-facing strings using flat dot-notation keys in source files, then leverage automated daily translation workflows or manual generation to support multiple locales including zh-CN and en-US. Common namespaces cover shared UI, chat features, settings, and more.
This skill walks you through converting an i18next-based project to Lingui, from installing dependencies and configuring build tools through rewriting React components and translation strings. It addresses namespace mapping, plural form restructuring, and catalog format changes, then shows how to extract and compile your messages for production.
This skill teaches you how to build multilingual applications by establishing translation infrastructure, identifying hardcoded text that should be externalized, and ensuring proper locale handling across different regions and writing systems. Learn patterns for React, Next.js, and Python, plus techniques for RTL languages and locale-aware date and number formatting.
More skills localization-l10n (Apache-2.0) · lingui-best-practices (MIT)