← ClaudeAtlas

i18n-locale-extractorlisted

Extract hardcoded UI text strings into structured internationalization JSON translation files.
RMAzrim/opencode-artes · ★ 2 · Data & Documents · score 76
Install: claude install-skill RMAzrim/opencode-artes
# i18n Locale Extractor ## Prerequisites & Dependencies - Node.js 18+ with npm or pnpm - Mandatory packages: `npm i -g i18next-extract` or `npm i react-i18next i18next` - A codebase with hardcoded strings (JSX, HTML, or plain text) - Optional: `npm i -D json5` for flexible JSON handling during extraction ## Execution Steps 1. Scan the codebase for hardcoded string literals: search for `\"`, `'\`, or template literals used in `innerText`, `placeholder`, `alt`, or `render()` calls 2. Extract each unique string and assign a message ID (camelCase or UUID) to avoid collisions 3. Group strings by namespace or component (e.g., `login`, `header`, `footer`) to produce a structured JSON tree 4. Generate the initial translation file in the format expected by your i18n library: - **i18next**: `{ "login": { "username": "Username", "password": "Password" } }` - **react-i18next**: same JSON structure, consumed via `<Translation>` 5. Replace the original hardcoded strings in the source code with `i18next.t('message.id')` calls (or `t('login.username')` for namespaced access) 6. Validate the extraction by building the app and checking that no missing keys appear in the console warnings 7. Commit the translation JSON files (`en.json`, `es.json`, etc.) and continue translating with your team ```json // Example: extracted en.json for a login form { "login": { "title": "Sign in to your account", "username": "Username", "password": "Password", "submit": "Log in", "fo