Source profileQuality 91/100

vasilyu1983/AI-Agents-public/frameworks/shared-skills/skills/software-localisation/SKILL.md

software-localisation

Implements production-grade i18n/l10n for React, Vue, Angular, and Next.js with ICU format and RTL support. Use when setting up or debugging localisation.

Source repository stars
80
Declared platforms
2
Static risk flags
0
Last source update
2026-08-21
Source checked
2026-08-25

Decision brief

What it does: where it fits

Use this skill for production web-app i18n and l10n: library choice, message catalogs, ICU usage, locale routing, translation workflow, RTL, and release gates. The goal is not just translated strings. The goal is locale-safe product behavior.

Best for

  • setting up or debugging i18n in React, Vue, Angular, or Next.js
  • choosing libraries and catalog strategy
  • implementing ICU pluralisation, formatting, and locale detection

Not for

  • The product has one locale and no committed plan to add more — don't pre-build ICU catalogs, TMS integration, or locale routing "just in case." Ship plain strings and revisit when a second locale is real.
  • The ask is "translate this text" with no code, catalog, or product surface involved — that's a translation task, not a localisation-engineering task; do it directly.

Compatibility matrix

Platform support, with evidence labels

PlatformStatusEvidenceWhat to check
CodexDeclaredSource recordInstall path and trigger
Claude CodeDeclaredSource recordInstall path and trigger
CursorNot declaredNo explicit evidencePortability before use
Gemini CLINot declaredNo explicit evidencePortability before use
Open the compatibility checker

Installation

Inspect first. Install second.

The source command is displayed only when detected. A safe inspection prompt is always available so your agent can explain every action before execution.

Source-detected install commandSource
npx skills add https://github.com/vasilyu1983/AI-Agents-public --skill "frameworks/shared-skills/skills/software-localisation"
Safe inspection promptEditorial

Inspect the Agent Skill "software-localisation" from https://github.com/vasilyu1983/AI-Agents-public/blob/53f6cb73ea53a2646e3e7d4665062ad66f3683ac/frameworks/shared-skills/skills/software-localisation/SKILL.md at commit 53f6cb73ea53a2646e3e7d4665062ad66f3683ac. List every install step, command, network request, credential, file read/write, external action, and rollback step. Explain whether it fits my task. Do not install or execute anything until I approve.

Workflow

What the source asks the agent to do

  1. 01

    Workflow

    1. Confirm framework, locale count, route strategy, and translation workflow. 2. Choose the library and catalog model. 3. Define locale detection and persistence order. 4. Implement ICU or equivalent message formatting correctly. 5. Add extraction, review, and missing-key contro…

    Confirm framework, locale count, route strategy, and translation workflow.Choose the library and catalog model.Define locale detection and persistence order.
  2. 02

    Translation workflow

    extract keys, do not hand-copy them

    extract keys, do not hand-copy themkeep namespace structure stableadd translator context, glossary rules, and review gates
  3. 03

    Quick Reference

    Review the “Quick Reference” section in the pinned source before continuing.

    Review and apply the “Quick Reference” source section.
  4. 04

    When to Use This Skill

    setting up or debugging i18n in React, Vue, Angular, or Next.js

    setting up or debugging i18n in React, Vue, Angular, or Next.jschoosing libraries and catalog strategyimplementing ICU pluralisation, formatting, and locale detection
  5. 05

    Route Elsewhere

    general frontend architecture - software-frontend

    general frontend architecture - software-frontendinternational SEO and hreflang - marketing-seocross-cultural UX and market adaptation - software-ui-ux-design or marketing-geo-localization

Permission review

Static risk signals and limitations

No configured static risk pattern was detected

This is not proof of safety. Runtime behavior, indirect dependencies, and hidden external systems are outside the static scan.

Evidence record

Why each signal appears

EvidenceSourceComputedTestedEditorial
SignalValueEvidence typeMeaning
Quality score91/100ComputedDocumentation, specificity, maintenance, and trust rules
Repository stars80SourceRepository attention, not individual Skill quality
Compatibility2 platformsSourceDeclared in the catalog source record
Usage guideautomated source guideEditorialGenerated or reviewed according to the visible evidence level

Pinned source

Provenance and original SKILL.md

Repository
vasilyu1983/AI-Agents-public
Skill path
frameworks/shared-skills/skills/software-localisation/SKILL.md
Commit
53f6cb73ea53a2646e3e7d4665062ad66f3683ac
License
MIT
Collected
2026-08-25
Default branch
main
View the original SKILL.md

Software Localisation

Use this skill for production web-app i18n and l10n: library choice, message catalogs, ICU usage, locale routing, translation workflow, RTL, and release gates. The goal is not just translated strings. The goal is locale-safe product behavior.

Quick Reference

NeedStarting Direction
React or general flexibilityi18next / react-i18next
ICU-first catalogsreact-intl / FormatJS
Vuevue-i18n
Angular@angular/localize
Next.js App Routernext-intl
smaller bundle biasLingui
stronger generated wrapperstypesafe-i18n only when deliberate

When to Use This Skill

  • setting up or debugging i18n in React, Vue, Angular, or Next.js
  • choosing libraries and catalog strategy
  • implementing ICU pluralisation, formatting, and locale detection
  • adding RTL support
  • configuring extraction, translation workflow, or TMS integration
  • fixing missing translations, mixed-language regressions, or bad locale fallback behavior

Route Elsewhere

  • general frontend architecture -> software-frontend
  • international SEO and hreflang -> marketing-seo
  • cross-cultural UX and market adaptation -> software-ui-ux-design or marketing-geo-localization
  • general WCAG/ARIA compliance and European Accessibility Act (EAA) readiness -> software-accessibility; this skill only covers the i18n-specific slice (lang/dir propagation, script-aware line height, IME) in references/accessibility-i18n.md

When Not to Use This Skill

  • The product has one locale and no committed plan to add more — don't pre-build ICU catalogs, TMS integration, or locale routing "just in case." Ship plain strings and revisit when a second locale is real.
  • The ask is "translate this text" with no code, catalog, or product surface involved — that's a translation task, not a localisation-engineering task; do it directly.
  • The ask is about international SEO structure (hreflang, ccTLD vs subfolder) with no i18n implementation involved -> route to marketing-seo instead.

Workflow

  1. Confirm framework, locale count, route strategy, and translation workflow.
  2. Choose the library and catalog model.
  3. Define locale detection and persistence order.
  4. Implement ICU or equivalent message formatting correctly.
  5. Add extraction, review, and missing-key controls.
  6. Add RTL and visual regression coverage where needed.
  7. Block release on mixed-language or unsafe fallback behavior for indexable or customer-visible routes.

ASCII Flow

Localisation task
  -> Identify platform, source-of-truth catalog, and affected locales
  -> Choose key, ICU, formatting, and fallback strategy
  -> Patch durable source, not only generated output
  -> Check missing keys, plural rules, RTL, and text expansion
  -> Run generation or validation scripts
  -> Report locale coverage and residual translation risk

Library Selection Rules

SituationLibraryWhy
React / TypeScript, general flexibilityi18next + react-i18nextBest selector API and plugin ecosystem
ICU-first catalogs, FormatJS tooling already in usereact-intlTightest ICU integration; FormatJS extract/compile pipeline
Next.js App Routernext-intlBuilt for RSC + App Router; automatic locale routing
Vuevue-i18nFramework-native; best Vue tooling integration
Angular@angular/localizeBuild-time extraction and AOT compilation
Smaller bundle budgetLinguiSmallest runtime; macro-based message extraction
Team explicitly wants generated type wrapperstypesafe-i18nFull key-type safety; high maintenance model

Do not choose by popularity alone. Choose by routing model, extraction needs, ICU expectations, and team maintenance habits.

ICU MessageFormat 2 (MF2): Not Yet a Default Choice

MF2 is standardized at the syntax level in Unicode's LDML spec (stabilized through LDML 47-48), which makes it tempting to treat as "the new ICU." Do not migrate production catalogs to it as of mid-2026: ICU's own reference implementations are still draft/technology-preview status, and none of react-intl/FormatJS, i18next, vue-i18n, or Lingui has shipped a production MF2 migration path, and no mainstream TMS round-trips it. Keep using MessageFormat 1 / ICU syntax (documented in references/icu-message-format.md) and re-check adoption status before recommending a switch — this is a common "the spec is final, so it must be safe to use" misdiagnosis.


Core Rules

Encoding and content model

  • use UTF-8 end to end
  • never concatenate translatable strings
  • use interpolation and ICU plural or select rules instead of ad hoc formatting

Locale routing and fallback

  • locale selection should prioritize user preference, then route or URL, then cookie, then headers, then default locale
  • always define a fallback locale
  • never silently fall back to English on indexable non-English routes
  • metadata, breadcrumbs, JSON-LD, and visible copy must stay in the same locale

Translation workflow

  • extract keys, do not hand-copy them
  • keep namespace structure stable
  • add translator context, glossary rules, and review gates
  • hardcoded string detection and missing-key checks should run in CI

RTL and accessibility

  • use CSS logical properties
  • set dir="rtl" where required
  • test with real RTL content
  • verify BiDi handling, icons, and screen-reader behavior across locales

Production Gates

GateFailure conditionRemediation
Mixed-language outputAny locale-routed page renders keys from a different localeMissing-key CI check catches before merge
Missing-key bleedCore UX or marketing route shows a key ID or raw fallback stringExtraction + catalog diff in CI pipeline
Machine translation on release pathMT output inserted without glossary, tone, or reviewer gateAdd human review step for all customer-visible locales
Locale switch drops state or breaks navigationUser changes locale and loses cart, form, or route stateCentralize locale state; separate from route/cookie
RTL launched without visual validationArabic/Hebrew/Farsi layout broken on launchRequire visual pass on one RTL locale before release
EU-market product ships accessible markup but only one languagePasses WCAG in English yet still fails the combined EAA + consumer-language bar in non-English EU marketsReview accessibility and localisation together for EU-facing surfaces; see references/accessibility-i18n.md

Known Traps

TrapPrevention
Keys drift between extraction, TMS, and runtime — fallback "works" but locale is brokenRun missing-key checks in CI; diff extraction output against TMS catalog before release
Visible strings translated, but validation messages / metadata / emails / JSON-LD left in EnglishEnumerate all locale surfaces (UI, email, SEO, legal) at project start; treat each as a separate test gate
String concatenation for grammar-sensitive or gendered copyUse ICU {count, plural, ...} / {gender, select, ...}; never "Hello " + name
Only Latin-script locales testedRequire one long-string locale (de/ru) and one non-Latin (ja/ar) before "complete"
Locale persisted separately in route, cookie, and client state with no precedence ruleDefine precedence order once: user preference > URL route > cookie > Accept-Language > default locale
Machine translation shipped without glossary or reviewRequire glossary, tone rules, and human review gate for all customer-visible content
Plural category count assumed from memory (e.g. "French is just one/other like English")CLDR revises per-language category counts over time (French now has one, many, other); verify against the current CLDR plural rules chart, don't hardcode from a prior project
Translated content rendered as raw HTML (v-html, dangerouslySetInnerHTML, ICU HTML tags) with no CSP/Trusted TypesReal XSS advisories exist for this exact pattern in both vue-i18n (CVE-2025-53892) and Angular's i18n pipeline (CVE-2026-27970) — treat translation-file write access as privileged and pin patched library versions

Common Anti-Patterns

Anti-patternCorrect approach
English as silent fallback on locale-routed pagesFail visibly in CI or preview when a key is missing in a non-default locale
Business logic encoded in translation keysKeys represent UI text; business logic belongs in code
Translations split by developer convenienceSplit by stable product domain and runtime loading boundary
CSS directional properties (left, right) patched per-view for RTLUse CSS logical properties (inline-start, inline-end) from the start
Each product surface (marketing, support, product) runs separate locale logicCentralize fallback, formatting, and detection in one shared locale layer

Ops Runbook

For large locale catalogs or mixed-language incidents:

  • diff keys first
  • translation pass second
  • treat marketing and SEO locale gaps as release blockers
  • chunk large locale files instead of reading them in one pass

Use references/ops-runbook.md for the detailed triage procedure.

Navigation

Core references

Templates and data

Maintenance

  • python3 scripts/check_urls.py
  • python3 scripts/check_examples.py

Related Skills

Fact-Checking

  • Known bugs, regressions, framework/compiler/runtime footguns, and version-specific crash or workaround guidance must be verified against current primary web sources before being treated as current fact.
  • Verify current library support, framework compatibility, and recommended tooling before final answers.
  • Prefer official docs, package registries, and release notes for version-sensitive guidance.
  • If web access is unavailable, mark version and maintenance guidance as unverified.

Learnings Loop

Before applying this skill on a non-trivial task, read learnings.consolidated.md in this directory (and learnings.md if present).

After applying it, if you encountered a pattern worth remembering, a mistake worth preventing, or a domain fact that surprised you, append one dated bullet to learnings.md via agents-skills-feedback-loop/scripts/append_learning.py. Do not modify SKILL.md itself.

Frequently asked questions

What to verify before installation and use

What does the software-localisation source document cover?

Use this skill for production web-app i18n and l10n: library choice, message catalogs, ICU usage, locale routing, translation workflow, RTL, and release gates. The goal is not just translated strings. The goal is locale-safe product behavior.

How do I install software-localisation?

The source record exposes this install command: npx skills add https://github.com/vasilyu1983/AI-Agents-public --skill "frameworks/shared-skills/skills/software-localisation". Inspect the command and pinned source before running it.

Which Agent platforms does the source record declare?

The pinned source record declares support for: codex, claude code.

Alternatives

Compare before choosing

Computed 961,101

fcakyon/claude-codex-settings

vercel-react-view-transitions

Guide for implementing smooth, native-feeling animations using React's View Transition API (`<ViewTransition>` component, `addTransitionType`, and CSS view transition pseudo-elements). Use this skill whenever the user wants to add page transitions, animate route changes, create shared element animations, animate enter/exit of components, animate list reorder, implement directional (forward/back) navigation animations, or integrate view transitions in Next.js. Also use when the user mentions view

Computed 96204

theBGuy/GitDesktop

vercel-react-view-transitions

Guide for implementing smooth, native-feeling animations using React's View Transition API (`<ViewTransition>` component, `addTransitionType`, and CSS view transition pseudo-elements). Use this skill whenever the user wants to add page transitions, animate route changes, create shared element animations, animate enter/exit of components, animate list reorder, implement directional (forward/back) navigation animations, or integrate view transitions in Next.js. Also use when the user mentions view

Computed 95528

vibeeval/vibecosystem

frontend-dev

Full-stack frontend development combining premium UI design, cinematic animations, AI-generated media assets, persuasive copywriting, and visual art. Builds complete, visually striking web pages with real media, advanced motion, and compelling copy. Use when: building landing pages, marketing sites, product pages, dashboards, generating media assets (image/video/audio/music), writing conversion copy, creating generative art, or implementing cinematic scroll animations.

Computed 931,248

first-fluke/oh-my-agent

oma-frontend

Frontend specialist for React, Next.js, Angular, TypeScript with FSD-lite architecture, shadcn/ui, and design system alignment. Use for UI, component, page, layout, CSS, Tailwind, shadcn, Angular, and RxJS work.